jQuery validate是一个强大的表单验证插件,省去了很多写JS验证表单的时间。在使用的时候,验证成功和失败的样式会有些冲突,解决办法也很简单,看下面的代码
$(function () {
/**
* register form validate
*/
//check names
var errorMessage = "请检查你的输入";
jQuery.validator.addMethod("isString", function(value, element) {
var isString = /^[a-zA-Z][a-zA-Z_]*$/;
return this.optional(element) || (isString.test(value));
}, errorMessage);
$('form[name=loginForm]').validate({
errorElement : 'span',
errorClass: "invalid",
success: "valid",
rules : {
username: {
required: true,
isString: true
},
password: {
required: true
}
},
messages : {
username : {
required : "不能为空!"
},
password : {
required : "不能为空!"
}
}
});
});
errorElement : 'span',意思是让错误提示信息以span元素来显示。
下面两句话是解决冲突的重点:
errorClass: "invalid", 意思是当验证错误的时候的class名称。
success: "valid",意思是当验证成功的时候的class名称。
加上这两个就能解决样式间的冲突了~~