您的位置:首页 > Web前端 > JQuery

jquery.validate.js表单验证

2012-08-28 10:36 567 查看
jquery.validate.js是一款表单验证插件。

下面从一个修改密码的表单来解说这款插件:

$(document).ready(function(){
jQuery.validator.addMethod("passcheck", function(value, element) {
return this.optional(element) || (/^(?![0-9]+$)(?![A-Z]+$)(?![a-z]+$)(?![\`\~\!\@\#\$\%\^\&\*\_\-\+\=\,\.\?\/\|\\]+$)(?![0-9\`\~\!\@\#\$\%\^\&\*\_\-\+\=\,\.\?\/\|\\]+$)[a-zA-Z0-9\`\~\!\@\#\$\%\^\&\*\_\-\+\=\,\.\?\/\|\\]{8,20}$/.test(value));
}, "格式不正确。");
jQuery.validator.addMethod("different", function(value, element) {
return this.optional(element) || value != $('#oldpass').val();
}, "格式不正确。");

$('#passform').validate({
rules :{				//rules验证规则
oldpass:{
required: true		//oldpass不能为空
},
password:{
required :true,		//password不能为空
passcheck :true,		//password输入规则,正则验证
different :true		//password不能与旧密码相同
},
password2:{
required :true,		//password2不能为空
equalTo:'#password'	//password2必须与password相同
}
},
messages :{
oldpass:{
required : '字段不为空'
},
password:{
required :'字段不为空 ',
passcheck :'密码不符合规则',
different :'新密码与旧密码不能相同'
},
password2:{
required :'字段不为空',
equalTo:'两次输入的密码不一致'
}
},
errorPlacement  :function(error, element){	//错误信息显示位置 element后面
element.next().html('<font color="red">'+error.html()+'</font>');
},
highlight       :function(element, errorClass, validClass){	//未通过的元素加样式 未通过的情况
},
unhighlight     :function(element, errorClass, validClass){  	//通过的元素加样式 通过的情况
$(element).next().html(' ');
},
onkeyup: false,						//
submitHandler: function (form) {				//
form.submit();
}
});
$('form input').blur(function(){
if($(this).valid){$(this).valid();}
});
});


jquery.validate.js 方法

jQuery.validator.addMethod("different", function(value, element) {
return this.optional(element) || value != $('#oldpass').val();
}, "格式不正确。");

jQuery.validator.addMethod("different", function(value, element){

return this.optional(element) || value != $('#oldpass').val();

}, "格式不正确");

this.optional(element),表单控件的值不为空时才触发。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: