Jquery-validate的基本使用

首先下面是一个简单的注册信息表单页面，很简单的HTML代码，也是我们需要录入元素的地方：

用户名:
真实姓名:
密码:
重复密码:
年龄:
电话:
电子邮件:
验证码:

接下来我们要对填写的表单进行校验，既然是用了JQuery.Validate来校验我们的表单，那么我们肯定要在HTML的头部引入JQuery和JQuery.Validate的JS库，因为下面的语句会调用函数库：









接着我们就在head里面添加我们的校验代码，因为使用了插件，所以校验的方式很简单，每个表单几行代码就可以搞定了：



完成了代码以后，我们可以打开页面测试校验结果，全部都没有录入，Email字段录入错误的格式，效果如下：


JQuery.Validate支持的校验规则有下面这些：

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

因为这个插件是外国人编写的，所以默认的提示信息是中文的，但是我们可以自定义他的提示语言，比如我就在head里面引入了jquery.validate.messages_cn.js文件，里面是我自定义的汉化版提示，如果某些特殊的需要单独提示的，可以直接在校验代码中以message:{}的形式定义，见上面标亮代码部分

这个插件使用其实是很方便便捷的，而且容易上手，在一些不复杂的系统都可以运用上去，本文写得比较粗糙，JQuery.Validate的功能远远不止我所描述的，感兴趣的同学百度，Google去了解下即可，下次提供一个手写的JQuery校验，功能和这个差不多，不过更加灵活了一些。