jQuery重写表单验证的方法（一）

jQuery的load(url,[data],[callback])方法

语法说明：url为异步请求的地址，data用来向服务器传送请求数据，为可选参数。一旦data参数启用，整个请求过程将以post的方式进行，否则默认为get方式。如果希望在get方式下也传递数据，可以在url地址后面用类似“dataname1=data1&dataName2=data2”的方法。

callback为Ajax加载成功后运行的回调函数。另外使用load()方法返回的数据，不再需要考虑是文本还是XML，jQuery都会自动进行处理。好了，下面马上使用load()方法实现“自动表单验证”实例。首先是，html框架，5个例子都是一样的，如下：

 
 
<form>   
用户昵称:<input type="text" onblur="startCheck(this)" name="User" id="User"><span id="UserResult"></span><br />   
输入密码:<input type="password" name="passwd1"><br />   
确认密码:</td><td><input type="password" name="passwd2"><br />   
<input type="submit" value="注册" class="button">   
<input type="reset" value="重置" class="button">   
</form>  

必要说明：

1、οnblur="startCheck(this)" 这是JavaScript代码(简称js) ，意思是text文本框失去焦点时触发自定义函数startCheck(),this是指代text文本框的值。

2、<span id="UserResult"></span>用来存放异步对象返回的结果。

 
 
jQuery代码如下：  
 
<script language="javascript" src="jquery.min.js"></script>   
<script language="javascript">   
function startCheck(oInput){   
    //首先判断是否有输入，没有输入直接返回，并提示   
    if(!oInput.value){   
        oInput.focus(); //聚焦到用户名的输入框   
        document.getElementById("UserResult").innerHTML = "User cannot be empty.";   
        return;   
    }   
    oInput=$.trim(oInput.value); //使用jQuery的$.trim()方法过滤左右空格   
    var sUrl = "action.asp?user=" + oInput;   
    sUrl=encodeURI(sUrl); //使用encodeURI()编码，解决中文乱码问题   
    $("#UserResult").load(sUrl,function(data){   
        $("#UserResult").html(decodeURI(data)); //使用decodeURI()解码   
        }   
    );   
}   
</script>  

必要说明：

1、使用jQuery时，都必须加载jquery.min.js文件，可以到http://jquery.com/官网下载最新的版本。

2、判断是否有输入时，用的全是JavaScript语法。

3、对传递给“处理页”的参数进行encodeURI编码，以解决中文乱码问题。

4、load()中的function函数是为了对返回结果进行decodeURI解码，以解决中文乱码问题。

5、对$.trim()、$("#UserResult")、html等jQuery语法不理解的，可以参考jQuery中文手册。本站提供下载。

 
 
action.asp处理页代码如下：  
 
<%   
if(Request("user")="eko") then   
Response.Write "Sorry, " & Request("user") & " already exists."   
else   
Response.Write Request("user")&" is ok."   
end if   
%> 

必要说明：

1、action.asp处理页的编码是GB2312，如果把"Sorry..already exists..is ik"等英文改为中文，请看下面的说明。

2、使用post方法会出现乱码，这是由于异步对象XMLHttpRequest在处理返回的responseText的时候，是按UTF-8编码进行解码的。

3、所以post方式的话，必须把action.asp页另存为时，第三项的编码由 ANST 改为 UTF-8 (请务必记住!!)。