jquery的validate插件使用整理.doc

第一部分：HelloWorld
jQuery.validate插件的作用
jquery.validate是jquery旗下的一个验证框架，借助jquery的优势，我们可以迅速验证一些常见的输入，还可以自己扩充自己的验证方法，并且对国际化也有很好的支持。
HelloWorld
说明：需要JQuery版本：1.2.6+
步骤：
导入的jQuery.js与jquery.validate.js等文件，注意顺序不要颠倒<scripttype="text/javascript"src="jquery.js"><scripttype="text/javascript"src="jquery.metadata.js"><scripttype="text/javascript"src="jquery.validate.js">
指定哪个（或哪些）表单要在提交前先进行验证<scripttype="text/javascript">
$(function(){
$("#testForm").validate();
});
</script>
指定每个字段的验证规则名称*<inputtype="text"name="loginName"class="required">其中class="required"表示本字段必须要填写。

效果如下图：

第二部分：基础知识
指定验证规则的方式
把验证规则写到字段元素的class属性中
例：
用户名：<inputtype="password"name="password"class="required">
电子邮件：<inputtype="text"name="email"class="requiredemail">
密码：<inputtype="password"name="password"id="password1"
class="{required:true,minlength:3}">
再次输入密码：<inputtype="password"name="password2"
class="{equalTo:'[#password1]'}required">

以上用了两种方式：
指定多个class名称（验证规则），多个class名称之间用空格隔开，如：class="requiredemail"。
使用JSON对象，指定多个属性，如：class="{required:true,minlength:3}"。可以为某验证规则指定所用的参数，如minlength规则需要指定最小长度，这里为3。
混合使用，如：class="{equalTo:'[#password1]'}required"。

说明：
如果使用第2种方式（JSON对象），就必须引入：jquery.metadata.js，作用是解析JSON对象。
如果表单字段的name不能重复，则只有最前面的配置起作用。
调用validate()方法时指定验证规则
$(function(){
$("#testForm").validate({
rules:{
loginName:{required:true,minlength:2},
password:{required:true},
password2:{equalTo:"#password1"}
}
});
});
可以使用哪些验证规则（内置的验证规则）
required:true必填字段remote:"/checkName.do"使用ajax方式访问”/checkName.do”，通过返回true或false表示输入值通过或未通过验证email:true必须输入正确格式的电子邮件url:true必须输入正确格式的网址date:true必须输入正确格式的日期dateISO:true必须输入正确格式的日期(ISO)，例如：2010-01-01，2010/01/01只验证格式，不验证有效性number:true必须输入合法的数字(负数，小数)digits:true必须输入整数creditcard:必须输入合法的信用卡号equalTo:"expr"输入值必须和$(“expr”)的值相同，expr例子：#fieldIdaccept:"gif|png|jpg"输入拥有合法后缀名的字符串（上传文件的后缀），多个后缀之间用’|’隔开maxlength:5输入长度最多是5的字符串(汉字算一个字符)minlength:3输入长度最小是3的字符串(汉字算一个字符)rangelength:[5,10]输入长度必须介于5和10之间的字符串")(汉字算一个字符)range:[5,10]输入值必须介于5和10之间max:5输入值不能大于5min:10输入值不能小于10说明：
remote是远程验证。比如注册验证用户名是否已