<转>jQuery.Validate印证库

<转>jQuery.Validate验证库

http://blog.163.com/shexinyang@126/blog/static/13673931220125289219121/

?

一、用前必备
官方网站：http://bassistance.de/jquery-plugins/jquery-plugin-validation/?
API:?http://jquery.bassistance.de/api-browser/plugins.html?
当前版本：1.5.5
需要JQuery版本：1.2.6+, 兼容 1.3.2
<script src="http://blog.163.com/shexinyang@126/blog/../js/jquery.js" type="text/javascript"></script>
<script src="http://blog.163.com/shexinyang@126/blog/../js/jquery.validate.js" type="text/javascript"></script>

二、默认校验规则
(1)required:true?????????????? 必输字段
(2)remote:"check.php"????????? 使用ajax方法调用check.php验证输入值
(3)email:true????????????????? 必须输入正确格式的电子邮件
(4)url:true??????????????????? 必须输入正确格式的网址
(5)date:true?????????????????? 必须输入正确格式的日期
(6)dateISO:true??????????????? 必须输入正确格式的日期(ISO)，例如：2009-06-23，1998/01/22 只验证格式，不验证有效性
(7)number:true???????????????? 必须输入合法的数字(负数，小数)
(8)digits:true???????????????? 必须输入整数
(9)creditcard:???????????????? 必须输入合法的信用卡号
(10)equalTo:"#field"?????????? 输入值必须和#field相同
(11)accept:??????????????????? 输入拥有合法后缀名的字符串（上传文件的后缀）
(12)maxlength:5??????????????? 输入长度最多是5的字符串(汉字算一个字符)
(13)minlength:10?????????????? 输入长度最小是10的字符串(汉字算一个字符)
(14)rangelength:[5,10]???????? 输入长度必须介于 5 和 10 之间的字符串")(汉字算一个字符)
(15)range:[5,10]?????????????? 输入值必须介于 5 和 10 之间
(16)max:5????????????????????? 输入值不能大于5
(17)min:10???????????????????? 输入值不能小于10

三、默认的提示

1. messages:?{??
2. ????required:?"This?field?is?required.",??
3. ????remote:?"Please?fix?this?field.",??
4. ????email:?"Please?enter?a?valid?email?address.",??
5. ????url:?"Please?enter?a?valid?URL.",??
6. ????date:?"Please?enter?a?valid?date.",??
7. ????dateISO:?"Please?enter?a?valid?date?(ISO).",??
8. ????dateDE:?"Bitte?geben?Sie?ein?g眉ltiges?Datum?ein.",??
9. ????number:?"Please?enter?a?valid?number.",??
10. ????numberDE:?"Bitte?geben?Sie?eine?Nummer?ein.",??
11. ????digits:?"Please?enter?only?digits",??
12. ????creditcard:?"Please?enter?a?valid?credit?card?number.",??
13. ????equalTo:?"Please?enter?the?same?value?again.",??
14. ????accept:?"Please?enter?a?value?with?a?valid?extension.",??
15. ????maxlength:?$.validator.format("Please?enter?no?more?than?{0}?characters."),??
16. ????minlength:?$.validator.format("Please?enter?at?least?{0}?characters."),??
17. ????rangelength:?$.validator.format("Please?enter?a?value?between?{0}?and?{1}?characters?long."),??
18. ????range:?$.validator.format("Please?enter?a?value?between?{0}?and?{1}."),??
19. ????max:?$.validator.format("Please?enter?a?value?less?than?or?equal?to?{0}."),??
20. ????min:?$.validator.format("Please?enter?a?value?greater?than?or?equal?to?{0}.")??
21. },??

?

如需要修改，可在js代码中加入：

1. jQuery.extend(jQuery.validator.messages,?{??
2. ????????required:?"必选字段",??
3. ??remote:?"请修正该字段",??
4. ??email:?"请输入正确格式的电子邮件",??
5. ??url:?"请输入合法的网址",??
6. ??date:?"请输入合法的日期",??
7. ??dateISO:?"请输入合法的日期?(ISO).",??
8. ??number:?"请输入合法的数字",??
9. ??digits:?"只能输入整数",??
10. ??creditcard:?"请输入合法的信用卡号",??
11. ??equalTo:?"请再次输入相同的值",??
12. ??accept:?"请输入拥有合法后缀名的字符串",??
13. ??maxlength:?jQuery.validator.format("请输入一个长度最多是?{0}?的字符串"),??
14. ??minlength:?jQuery.validator.format("请输入一个长度最少是?{0}?的字符串"),??
15. ??rangelength:?jQuery.validator.format("请输入一个长度介于?{0}?和?{1}?之间的字符串"),??
16. ??range:?jQuery.validator.format("请输入一个介于?{0}?和?{1}?之间的值"),??
17. ??max:?jQuery.validator.format("请输入一个最大为?{0}?的值"),??
18. ??min:?jQuery.validator.format("请输入一个最小为?{0}?的值")??
19. });??

?

推荐做法，将此文件放入messages_cn.js中，在页面中引入

1. <script?src="../js/messages_cn.js"?type="text/javascript"></script>??

?

四、使用方式
1.将校验规则写到控件中

1. <script?src="../js/jquery.js"?type="text/javascript"></script>??
2. <script?src="../js/jquery.validate.js"?type="text/javascript"></script>??
3. <script?src="./js/jquery.metadata.js"?type="text/javascript"></script>??
4. $().ready(function()?{??
5. ?$("#signupForm").validate();??
6. });??
7. ??
8. <form?id="signupForm"?method="get"?action="">??
9. ????<p>??
10. ????????<label?for="firstname">Firstname</label>??
11. ????????<input?id="firstname"?name="firstname"?class="required"?/>??
12. ????</p>??
13. ?<p>??
14. ??<label?for="email">E-Mail</label>??
15. ??<input?id="email"?name="email"?class="required?email"?/>??
16. ?</p>??
17. ?<p>??
18. ??<label?for="password">Password</label>??
19. ??<input?id="password"?name="password"?type="password"?class="{required:true,minlength:5}"?/>??
20. ?</p>??
21. ?<p>??
22. ??<label?for="confirm_password">确认密码</label>??
23. ??<input?id="confirm_password"?name="confirm_password"?type="password"?class="{required:true,minlength:5,equalTo:'#password'}"?/>??
24. ?</p>??
25. ????<p>??
26. ????????<input?class="submit"?type="submit"?value="Submit"/>??
27. ????</p>??
28. </form>??

使用border="0" cellpadding="0" style="">??