jquery $.ajax 检测用户名是否存在

接下来就是js了，各位可以自己在网上下载jquery-1.3.2.min.js类库，我在这里就不提供了。

创建validator.js，代码如下：

$(function() {
    var txtname = $("#txtname");
    //输入文字时文本框样式
    txtname.keyup(function() {
        var name = $(this).val();
        if (name == "")
            $(this).addclass("txtname");
        else $(this).removeclass("txtname");
    })
    //失去焦点时验证用户名是否可用
    $("#txtname").blur(function() {
        var name = $(this).val();
        $.get("thylx.asp教程x?name=" + name, null, function(response) {
            $("#result").html(response);
        })

    })
})

呵呵，就是怎么几行代码，比js好用多了~~

最后是创建thylx.aspx，thylx.aspx.cs代码如下：（这里aspx页面不用编辑，我们只是用来做数据操作而已，）

protected void page_load(object sender, eventargs e)
    {
        string name = request.querystring["name"].tostring();
        if (name == "thylx")
            response.write("该用户名已经存在！");
        else
            response.write("该用户名可以使用！");
    }

 

下面再看一款式jquery.validate和ajax来验证用户重复
jquery.validate上，无疑，jquery.validate是一个功能强大的form验证插件。
但在不熟悉的情况下，很难灵活的使用它。下面我就说说我在使用他的过程中遇到的问题。
我想实现的功能是（简单的就不说了）：使用jquery.validate来验证用户是否已经注册，如果已经注册就及时进行提示。如果你看到这里（前提是你对jquery.validate熟悉）

$("#myform").validate({   
   rules: {   
     username: {   
       required: true,   
       remote: "check_user.php教程"  
     }   
   }   
});  

想在使用jquery.validate进行客户端验证的时候，也要显示这样的提示信息。

remote1: function(value, element, param) {   
    if ( this.optional(element) )   
        return "dependency-mismatch";   
       
    var previous = this.previousvalue(element);   
       
    if (!this.settings.messages[element.name] )   
        this.settings.messages[element.name] = {};   
    this.settings.messages[element.name].remote1 = typeof previous.message == "function" ? previous.message(value) : previous.message;   
       
     param = typeof param == "string" && {url:param} || param;   
       
    if ( previous.old !== value ) {   
         previous.old = value;   
        var validator = this;   
        this.startrequest(element);   
        var data = {};   
         data[element.name] = value;   
         $.ajax($.extend(true, {   
             url: param,   
             mode: "abort",   
             port: "validate" + element.name,   
             datatype: "json",   
             data: data,   
             success: function(response) {   
                // 这里是主要修改的地方，我以json的方式返回了一组数据   
                // response.data：数据   
                // response.msg:返回的信息   
                // response.status:返回的状态   
                var valid = response.status;   
                if ( valid ) {   
                    var submitted = validator.formsubmitted;   
                     validator.prepareelement(element);   
                     validator.formsubmitted = submitted;   
                     validator.successlist.push(element);   
                     validator.showerrors();   
                 } else {   
                    var errors = {};   
                    // 把response.msg作为其错误信息   
                     errors[element.name] = previous.message = response.info;   
                     validator.showerrors(errors);   
                 }   
                 previous.valid = valid;   
                 validator.stoprequest(element, valid);   
             }   
         }, param));   
        return "pending";   
     } else if( this.pending[element.name] ) {   
        return "pending";   
     }   
    return previous.valid;   
}  

验证规则的时候是这样写的：

rules: {   
     txt_username: {   
         remote1:{   
             url: "/uc_app/index.php",   
             type: 'post',   
             data: {   
                 act:'chkuser',   
                 uid: function(){return $("#txt_username").val();}   
             }   
         },   
         required: true,   
         minlength: 3,   
         maxlength: 10   
     }   
}