JQuery表单验证【八】
-- 表单验证的validation插件 --
一．jQuery插件的概述
jQuery提供了第三方插件支持功能，任何的第三方厂商都可以针对jQuery再开发新的功能
对jQuery的功能进行增强，称为jQuery的插件
validate插件作用：就是用来对用户在表单上输入的数据进行验证，如果验证不通过，表单不能提交。
验证原则：已经创建了一些通用的验证器，我们直接使用验证器就可以了。
1) 指定验证器的名字
2) 出错信息
二．validate插件的使用步骤
1. 使用步骤：
1) 下载jquery-validation插件
2) 将该插件（也就是一个js文件）导入到我们的工程中
3) 在要使用验证插件的html中引入该js文件
3.1) 先导入jQuery(lib目录下)
3.2) 导入验证框架：jquery.validate.js或jquery.validate.min.js (在dist目录下)
3.3) 如果要让默认信息提示中文，可以导入messages_cn.js (在dist\localization\目录下)
验证器："出错误的信息"
required: "必填字段",
email: "请输入正确格式的电子邮件",
url: "请输入合法的网址",
2. 语法：
$("表单对象").validate({
rules: 验证规则,
messages: 出错信息
});
三．常用的验证规则
1. 默认的验证规则：
1) required:true 必须输入的字段。
2) remote:"check.jsp" 使用 ajax 方法调用 check.jsp 验证输入值。
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。
2. 注：一个表单项可以同时使用多个验证器，如果上一个验证器失败，则不会继续运行下一个验证器。
3. 修改消息的显示位置：
自己写个label，放在信息显示的信息，设置display: none
四．自定义验证规则
1. 什么时候使用：
如果自带的验证器不能满足需要的时候，我们可以写自定义的验证器
2. 语法：
$.validator.addMethod("验证器名字", function(value, element, params));
value: 表示表单控件中输入的值，如：文本框输入值
element： 表单控件对象，如：文本框
params： 验证器后写的参数，如：max:5，params就是5
返回true，表示验证通过，false表示验证失败
3. 示例：验证身份证的长度必须是15或18位
1) 文本框输入：
2) 验证代码：
2.1) 验证规则：
a) 必须输入
b) 长度是15或18
c) 15位要全是数字
d) 18位最后一位可以是X
2.2) 验证信息：
required: "身份证号不能为空",
cardlength: "身份证长度必须是15位或18位",
cardformat15: "15位必须全是数字",
cardformat18: "18位身份证格式不正确"
3) 创建自定义验证器：
3.1) 验证身份证的长度必须是15或18位，去掉空格。
3.2) 验证15位身份证的格式，全是数字
3.3) 验证18位身份证格式，18位数字或17位数字加X
我的jquery表单校验页面
一．jQuery插件的概述
jQuery提供了第三方插件支持功能，任何的第三方厂商都可以针对jQuery再开发新的功能
对jQuery的功能进行增强，称为jQuery的插件
validate插件作用：就是用来对用户在表单上输入的数据进行验证，如果验证不通过，表单不能提交。
验证原则：已经创建了一些通用的验证器，我们直接使用验证器就可以了。
1) 指定验证器的名字
2) 出错信息
二．validate插件的使用步骤
1. 使用步骤：
1) 下载jquery-validation插件
2) 将该插件（也就是一个js文件）导入到我们的工程中
3) 在要使用验证插件的html中引入该js文件
3.1) 先导入jQuery(lib目录下)
3.2) 导入验证框架：jquery.validate.js或jquery.validate.min.js (在dist目录下)
3.3) 如果要让默认信息提示中文，可以导入messages_cn.js (在dist\localization\目录下)
验证器："出错误的信息"
required: "必填字段",
email: "请输入正确格式的电子邮件",
url: "请输入合法的网址",
2. 语法：
$("表单对象").validate({
rules: 验证规则,
messages: 出错信息
});
三．常用的验证规则
1. 默认的验证规则：
1) required:true 必须输入的字段。
2) remote:"check.jsp" 使用 ajax 方法调用 check.jsp 验证输入值。
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。
2. 注：一个表单项可以同时使用多个验证器，如果上一个验证器失败，则不会继续运行下一个验证器。
3. 修改消息的显示位置：
自己写个label，放在信息显示的信息，设置display: none
四．自定义验证规则
1. 什么时候使用：
如果自带的验证器不能满足需要的时候，我们可以写自定义的验证器
2. 语法：
$.validator.addMethod("验证器名字", function(value, element, params));
value: 表示表单控件中输入的值，如：文本框输入值
element： 表单控件对象，如：文本框
params： 验证器后写的参数，如：max:5，params就是5
返回true，表示验证通过，false表示验证失败
3. 示例：验证身份证的长度必须是15或18位
1) 文本框输入：
2) 验证代码：
2.1) 验证规则：
a) 必须输入
b) 长度是15或18
c) 15位要全是数字
d) 18位最后一位可以是X
2.2) 验证信息：
required: "身份证号不能为空",
cardlength: "身份证长度必须是15位或18位",
cardformat15: "15位必须全是数字",
cardformat18: "18位身份证格式不正确"
3) 创建自定义验证器：
3.1) 验证身份证的长度必须是15或18位，去掉空格。
3.2) 验证15位身份证的格式，全是数字
3.3) 验证18位身份证格式，18位数字或17位数字加X
员工信息录入