一、validate简介
validate是JQ的一个插件。其是对一些常用常见的表单校验方法进行了封装。方别使用与开发。同时提供了一个用来编写用户自定义方法的 API。所有的捆绑方法默认使用英语作为错误信息,且已翻译成其他 37 种语言。
二、使用方法
1、因为validate为JQ的插件,因此使用时,需要先导入JQ.js文件,然后再导入validate.js。
2、在页面加载成功后对表单进行校验。
3、校验方法 $("选择器").validate()。
4、编写规则:
$("选择器").validate({
rules:{}, //规则
messages:{} (messages为自定义提示信息,其可有可无,如果没有。则一切提示信息为默认)
});
三、默认校验规则
| 序号 | 规则 | 描述 |
|---|---|---|
| 1 | required:true | 必须输入的字段。 |
| 2 | remote:"check.php" | 使用 ajax 方法调用 check.php 验证输入值。 |
| 3 | email:true | 必须输入正确格式的电子邮件。 |
| 4 | url:true | 必须输入正确格式的网址。 |
| 5 | date:true | 必须输入正确格式的日期。日期校验 ie6 出错,慎用。 |
| 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 |
四、举例
导入步骤省略
$(function(){
$("#form1").validate({
rules:{
//字段的name属性:"校验器"
username:"required(必须的)" //意为name属性为username的输入框必须填入信 //息。否则提示默认错误信息。
//字段的name属性:{校验器:"值",校验器:“值”}
required:true,
digits:true
}
},
messages:{
//字段的name属性:“提示信息”
username:"用户名不能为空" //意为将默认的提示信息改为“用户名不能为空”
//字段的name属性:{校验器:"提示信息",校验器:“提示信息”}
}
});
});
五、备注
在设置提示信息时,默认为英文。这时,除了使用messages:{}外,还可以导入messages_zh.js即国际化中文包。使得提示信息从英文变为中文。
备注:由于个人原因,本博客暂停更新。如有问题可联系本人,本人提供技术指导、学习方向、学习路线。本人微信wlp1156107728(添加注明来意) QQ1156107728(添加注明来意)
本文介绍了JQ的validate插件,它提供了表单验证功能,包括预设的验证规则和自定义方法API。通过示例展示了如何导入与应用validate,编写验证规则,并修改提示信息。此外,还提到了国际化支持和作者提供的技术支持。

431

被折叠的 条评论
为什么被折叠?



