验证插件（validate.js），是一款验证常规表单数据合法性的插件。使用它，极大的解放了在表单上繁杂的验证过程，并且错误提示显示的完善也增加了用户体验。
使用validate.js插件
官网下载：http://bassistance.de/jquery-plugins/jquery-plugin-validation
最重要的文件是jquery.validate.js，还有两个可选的辅助文件：additional-methods.js（控件class方式）和message_zh.js（提示汉化）文件（实际使用，请使用min压缩版）。
第一步：引入jquery.validate.js：
<script type="text/javascript" src="jquery.validate.js"></script>
第二步：在JS文件中执行：
$('#reg').validate();
默认验证规则
validate.js的默认验证规则的写法有两种形式：1.控件属性方式；2.JS键值对传参方式
默认规则列表
| 规则名 | 说明 |
| required:true | 必须输入字段 |
| email:true | 必须输入正确格式的电子邮件 |
| url:true | 必须输入正确格式的网址 |
| date:true | 必须输入正确格式的日期（IE6验证出错） |
| dateISO:true | 必须输入正确格式的日期(ISO)（只验证格式，不验证有效） |
| number:true | 必须输入合法的数字(负数，小数) |
| digits:true | 必须输入正整数 |
| creditcard:true | 必须输入合法的信用卡号，例如：5105105105105100 |
| equalTo:"#field" | 输入值必须和#field相同 |
| minlength:5 | 输入长度最小是5的字符串(汉字算一个字符) |
| maxlength:10 | 输入长度最多是10的字符串(汉字算一个字符) |
| rangelength:[5,10] | 输入长度介于5和10之间的字符串(汉字算一个字符) |
| range:[5,10] | 输入值必须介于5和10之间 |
| min:5 | 输入值不能小于5 |
| max:10 | 输入值不能大于10 |
| remote:"check.php" | 使用ajax方法调用check.php验证输入值 |
index.html：
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>知问前端</title> <script type="text/javascript" src="jquery-1.12.3.js"></script> <script type="text/javascript" src="jquery-ui.js"></script> <script type="text/javascript" src="jquery.validate.js"></script> <script type="text/javascript" src="index.js"></script> <link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico" /> <link rel="stylesheet" type="text/css" href="jquery-ui.css" /> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body> <form id="reg" action="123.html"> <p>账号：<input type="text" name="user" /></p> <p>邮件：<input type="text" name="email" /></p> <p>网址：<input type="text" name="url" /></p> <p>日期：<input type="text" name="date" /></p> <p>日期：<input type="text" name="dateISO" /></p> <p>数字：<input type="text" name="number" /></p> <p>正整数：<input type="text" name="digits" /></p> <p>信用卡：<input type="text" name="creditcard" /></p> <p>密码：<input type="text" name="pass" id="pass" /></p> <p>密码确认：<input type="text" name="notpass" /></p> <p>小于：<input type="text" name="min" /></p> <p>5-10之间的数字：<input type="text" name="range" /></p> <p>5-10位之间的字符串：<input type="text" name="rangelength" /></p> <p><input type="submit" value="提交" /></p> </form> </body> </html>
使用控件方式验证——必填和不得小于两位：
<input type="text" class="required" minlength="2" name="user" id="user" />
注意：默认规则里设置布尔值的，直接写到class里即可实现，如果是数字或数组区间，直接使用属性=值的方式即可。而对于错误提示，可以引入中文汉化文件，或直接替换掉即可。
使用JS对象键值对传参方式设置：
$('#reg').validate({
rules : {
user : { //只有一个规则的话，
required : true, //直接user : 'required',
minlength : 2
}
},
messages : {
user : {
required : '帐号不得为空！',
minlength : '帐号不得小于 2 位！'
}
}
});
注意：由于第一种形式不能设置指定的错误提示信息。我们推荐使用第二种形式，第二种形式也避免了HTML污染。
所有规则演示：
$(function() { $("#reg").validate({ rules:{ user:{ required:true, minlength:2 }, email:{ //required:true, email:true }, url:{ url:true }, date:{ date:true //输入日期格式可为YYYY-MM-DD(2014-01-01) }, dateISO:{ dateISO:true }, number:{ number:true }, digits:{ digits:true }, creditcard:{ creditcard:true //一点鸟用都没有！要你何用！ }, notpass:{ equalTo:"#pass" }, min:{ min:5 }, range:{ range:[5,10] }, rangelength:{ rangelength:[5,10] } }, messages:{ user:{ required:"账号不得为空！", minlength:"账号不得小于2位！" } } }); });