jquery validate笔记

配置验证信息

var validator=$form.validate({
	//验证规则
	rules:{
		//key为input的name，而不是ID
		'user.username':{
			required:true,
			remote: {  
				url: "/validateToken",     //服务器url  
				type: "post",               //数据发送方式  
				dataType: "json",           //接受数据格式     
				data: {                     //要传递的数据  
					'token': function(){
						return $form.find("#username").val();
					}
				}  
			}  
		},
		'user.email':{
			required:true,
			email:true
		},
		'user.password':{
			required:true
		},
		'user.confirmPassword':{
			required:true,
			equalTo:"#password"
		}
	},
	//错误信息,如果不设置则使用默认信息
	messages:{
		'user.username':{
			required:"用户名不能为空",
			remote:"用户名已存在" 
		},
	}
	//指定错误信息在哪里显示
	errorPlacement:function(error, element) {
		var placement = $(element.closest(".form-group").find(".errMsg"));
		placement.text('');
		error.appendTo(placement);
	},
	//输入后即验证
	onKeyup:true
});

触发表单验证

1. 表单进行submit时自动触发
2. $("form").valid() 触发

默认校验规则

(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

自定义规则

//手机号码验证 
	jQuery.validator.addMethod("phone", function(value, element) { 
		var length = value.length; 
		var mobile = /^0?(13[0-9]|15[012356789]|17[678]|18[0-9]|14[57])[0-9]{8}$/;
		return this.optional(element) || (length == 11 && mobile.test(value)); 
	}, "手机号码格式错误"); 

Ajax验证：

rules: {  
	username:{  
		required: true, 
		//服务器端验证，只接受true/false
		remote: {  
			url: "/validateToken",     //服务器url  
			type: "post",               //数据发送方式  
			dataType: "json",           //接受数据格式     
			data: {                     //要传递的数据  
			'token': function(){			//要用方法的形式传参，否则取不到值
				return $personPanel.find("form").find("#phone").val();
				}
			}  
		}  
	}  
},  

修改默认提示

 //修改默认提示
	jQuery.extend(jQuery.validator.messages, {
		required : "必填字段",
		remote : "请修正该字段",
		email : "请输入正确格式的电子邮件",
		url : "请输入合法的网址",
		date : "请输入合法的日期",
		dateISO : "请输入合法的日期 (ISO).",
		number : "请输入合法的数字",
		digits : "只能输入整数",
		creditcard : "请输入合法的信用卡号",
		equalTo : "请再次输入相同的值",
		accept : "请输入拥有合法后缀名的字符串",
		maxlength : jQuery.validator.format("请输入一个长度最多是 {0} 的字符串"),
		minlength : jQuery.validator.format("请输入一个长度最少是 {0} 的字符串"),
		rangelength : jQuery.validator.format("请输入一个长度介于 {0} 和 {1} 之间的字符串"),
		range : jQuery.validator.format("请输入一个介于 {0} 和 {1} 之间的值"),
		max : jQuery.validator.format("请输入一个最大为 {0} 的值"),
		min : jQuery.validator.format("请输入一个最小为 {0} 的值")
	});
jQuery.validator.defaults.errorClass="help-inline";
jQuery.validator.defaults.errorElement="span";
jQuery.validator.defaults.highlight=function(element, errorClass, validClass) {
	$(element).parents('.control-group').addClass('error');
};
jQuery.validator.defaults.unhighlight=function(element, errorClass, validClass) {
	$(element).parents('.control-group').removeClass('error');
	$(element).parents('.control-group').addClass('success');
};