在php项目开发过程中,表单的验证属于必不可少的一部分内容,因为几乎只要与数据库打交道的网站都会用到表单,需要用表单提交的话就会有输入及格式验证等内容了,不然会造成sql注入错误等问题。而一般我们的验证都是通过js做验证,这样的验证我们要写的js比较麻烦,而且验证提示的效果要做到好看的话也需要慢慢调试,这样耗费了我们的时间,而且还不敢保证验证完全了;下面我就为大家介绍一个比较好用的jquery的验证插件-jquery.validate.js,他是专门针对html的表单做验证的插件,而且可以做到表单项同时验证,可验证内容包括17项。

jquery.validate.js可验证规则包括:

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

这17个验证规则几乎包囊了我们需要的表单验证的内容,而且他的用法是十分简单的,我们这里就来介绍一下他在代码中的具体用法:

1、首先我们引用jquery.js及jquery.validate.js

2、然后我们会有一段表单内容,表单的代码这里就不写出来了

3、也就最后一步了,写js验证:

$(document).ready(function() { //这里主要了:要写到页面加载方法中
$(“#signupForm”).validate({
rules: { //验证内容写到rules{}中
firstname: “required”,
email: {
required: true,
email: true
},
password: {
required: true,
minlength: 5
},
confirm_password: {
required: true,
minlength: 5,
equalTo: “#password”
}
},
messages: {
firstname: “请输入姓名”,
email: {
required: “请输入Email地址”,
email: “请输入正确的email地址”
},
password: {
required: “请输入密码”,
minlength: jQuery.format(“密码不能小于{0}个字符”)
},
confirm_password: {
required: “请输入确认密码”,
minlength: “确认密码不能小于5个字符”,
equalTo: “两次输入密码不一致不一致”
}
}
});
});

这里还可以有一个写法,就是将将验证方法写到控件的class里面,例如:
input id=”confirm_password” name=”confirm_password” type=”password” class=”{required:true,minlength:5,equalTo:’#password’}” />//验证必须输入的最小5个长度的确定密码
这种验证方法的话就可以不用写js验证了,当然这个的话其实是他封装到另外一个js里面了,如果要用这种验证方法,
则需要引入另外一个js文件
引入jquery.metadata.js之后即可使用class验证方法。

这样,便实现了一个表单的各种输入框验证,而且可以很全面的验证到,提示信息该插件会自动在有错误的控件下添加一个span显示,当然这个也是可以修改的,你在插件代码里修改即可,当然更简单的方法是用css直接控制了
这个插件很方便也很强大,解决了很多编程的同学们表单验证的麻烦。