验证注册用户名的唯一

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<link href="css/css.css" rel="stylesheet" type="text/css" />
<script src="./js/jquery-1.3.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
 $("form :input.bt4").each(function(){
var $bt4 = $("<strong class='high'> *</strong>"); //创建元素
$(this).parent().append($bt4); //然后将它追加到文档中
});  
 
$('form :input').blur(function(){
 var $parent = $(this).parent();
 $parent.find(".formtips").remove();
//验证用户名
if($(this).is('#username') ){
if( this.value=="" || this.value.length < 5){
  var errorMsg = '请输入至少5位的用户名.';
  $parent.append('<span class="formtips onError">'+errorMsg+'</span>');
  }else{
  var okMsg = '输入正确.';
  $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');
  }
}
//验证密码
if($(this).is('#password')){
if(this.value=="" || this.value.length< 6){
var errorMsg = '请输入至少6为密码';
$parent.append('<span class="formtips onError">'+errorMsg+'</span>');
}else{
var okMsg = '输入正确.';
  $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');

}
}

//确认密码
if($(this).is('#password1')){
if(!this.value ||this.value != $("#password").val() ){
var errorMsg = '两次输入的密码不相同';
$parent.append('<span class="formtips onError">'+errorMsg+'</span>');
}else{
var okMsg = '输入正确.';
  $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');
}
}

//验证邮箱
if($(this).is('#email')){
if( this.value=="" || ( this.value!="" && !/^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(this.value) ) ){
                      var errorMsg = '请输入正确的邮箱.';
  $parent.append('<span class="formtips onError">'+errorMsg+'</span>');
}else {
                      var okMsg = '输入正确.';
  $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');
}
}
   }).focus(function(){
   $(this).triggerHandler("blur");})
//提交验证
$('#send').click(function(){
$("form :input.bt4").trigger('blur');
var numError = $('form .onError').length;
if(numError){
  alert("填写注册信息错误");
} else {
 echo  ("提交中....");
}
  })
   })
</script>
</head><body>
<form action="zhuce_a.php" method="post" >
<table cellpadding="0" cellspacing="0">
<tr>
<td>用户名：</td>
<td><input type="text" class="bt4" name="username" id="username" size="16" maxlength="16" /></td>
</tr>
<tr>
<td>密码：</td>
<td><input type="password" class="bt4" name="password" id="password" size="16" maxlength="16" /></td>
</tr>
<tr>
<td>确认密码：</td>
<td><input type="password" class="bt4" name="password1" id="password1" size="16" maxlength="16" /></td>
</tr>
<tr>
<td>邮箱:</td>
<td><input type="text" class="bt4" name="email" id="email" /></td>
</tr>
</table>
<input type="submit" name="send" id="send" value="提交" />
</form>
</body>
</html>谁能帮我把验证用户名 是否唯一 补充上呀  谢谢了

解决方案 »

  1.   

    能写的详细点吗  sql查询懂 主要是 ajax
      

  2.   

    ajax无刷新查询反馈输入框的用户名是否重复。
      

  3.   

    用jquery$.ajax的函数。具体看文档
      

  4.   

    写个onblur事件。鼠标离开的时候就验证
      

  5.   

    onblur  这段代码怎么写呀  我写老是出错误
      

  6.   

     $.ajax({ url: 'chech_mail.php',
            type: 'POST',
            data: { mail: mail },
            dataType: 'html',
            timeout: 1000,
            success: function(data) {
                if (data == "NO") {
                    document.getElementById("error").innerHTML = "该账户已经存在!";            }
                else {                //做你想做的。此处省略200行代码
                }        }
        });
      

  7.   

    你不会没有js基础吧？？？ onblur里写验证的方法。方法里放我上面的代码。 看下jquery的方法
      

  8.   

    那不就行了、
    你离开的时候验证。不存在返回true,可以提交。存在返回false 不允许提交
    你的php页面得到你提交过来的mail。然后你去数据库里查  查询的出来 return "false";证明存在  
      

  9.   

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>无标题文档</title>
    <link href="css/css.css" rel="stylesheet" type="text/css" />
    <script src="./js/jquery-1.3.1.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(function(){
     $("form :input.bt4").each(function(){
    var $bt4 = $("<strong class='high'> *</strong>"); //创建元素
    $(this).parent().append($bt4); //然后将它追加到文档中
    });  
     
    $('form :input').blur(function(){
     var $parent = $(this).parent();
     $parent.find(".formtips").remove();
    //验证用户名
    if($(this).is('#username') ){
    if( this.value=="" || this.value.length < 5){
      var errorMsg = '请输入至少5位的用户名.';
      $parent.append('<span class="formtips onError">'+errorMsg+'</span>');
      }else{
      var okMsg = '输入正确.';
      $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');
      }
    }

    //判断用户名是否存在onblur
    $('#username').onblur(function(){
    $.ajax({ url: 'zhuce_b.php',
      type: 'POST',
     data: { sum: sum },
      dataType: 'html',
      timeout: 1000,
      success: function(data) {
      if (data == "1") {
      var errorMsg = '用户名已存在.';
      $parent.append('<span class="formtips onError">'+errorMsg+'</span>');  }
      else  {
     var okMsg = '输入正确.';
      $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');
      }  }
      })
      })//验证密码
    if($(this).is('#password')){
    if(this.value=="" || this.value.length< 6){
    var errorMsg = '请输入至少6为密码';
    $parent.append('<span class="formtips onError">'+errorMsg+'</span>');
    }else{
    var okMsg = '输入正确.';
      $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');

    }
    }

    //确认密码
    if($(this).is('#password1')){
    if(!this.value ||this.value != $("#password").val() ){
    var errorMsg = '两次输入的密码不相同';
    $parent.append('<span class="formtips onError">'+errorMsg+'</span>');
    }else{
    var okMsg = '输入正确.';
      $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');
    }
    }

    //验证邮箱
    if($(this).is('#email')){
    if( this.value=="" || ( this.value!="" && !/^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/.test(this.value) ) ){
                          var errorMsg = '请输入正确的邮箱.';
      $parent.append('<span class="formtips onError">'+errorMsg+'</span>');
    }else {
                          var okMsg = '输入正确.';
      $parent.append('<span class="formtips onSuccess">'+okMsg+'</span>');
    }
    }
       }).focus(function(){
       $(this).triggerHandler("blur");})
    //提交验证
    $('#send').click(function(){
    $("form :input.bt4").trigger('blur');
    var numError = $('form .onError').length;
    if(numError){
      alert("填写注册信息错误");
    } else {
     echo  ("提交中....");
    }
      })
       })
    </script>
    </head><body>
    <form action="zhuce_a.php" method="post" >
    <table cellpadding="0" cellspacing="0">
    <tr>
    <td>用户名：</td>
    <td><input type="text" class="bt4" name="username" id="username" size="16" maxlength="16" /></td>
    </tr>
    <tr>
    <td>密码：</td>
    <td><input type="password" class="bt4" name="password" id="password" size="16" maxlength="16" /></td>
    </tr>
    <tr>
    <td>确认密码：</td>
    <td><input type="password" class="bt4" name="password1" id="password1" size="16" maxlength="16" /></td>
    </tr>
    <tr>
    <td>邮箱:</td>
    <td><input type="text" class="bt4" name="email" id="email" /></td>
    </tr>
    </table>
    <input type="submit" name="send" id="send" value="提交" />
    </form>
    </body>
    </html>
    <?php
    include_once("conntent.php");
    $sql = "select * from zhuce where username='".$_GET['username']."'";
    $sum = $DB_Server->query($sql);
    if($sum == 1){
    echo '1';
    }else if($sum == 0){
    echo '0';
    }
    ?>谁帮我看看 验证唯一哪里有问题呀？