creditcard: “请输入合法的信用卡号”,
equalTo: “请再次输入相同的值”,
accept: “请输入拥有合法后缀名的字符串”,
maxlength: jQuery.format(“请输入一个长度最多是 {0} 的字符串”),
minlength: jQuery.format(“请输入一个长度最少是 {0} 的字符串”),
rangelength: jQuery.format(“请输入一个长度介于 {0} 和 {1} 之间的字符串”),
range: jQuery.format(“请输入一个介于 {0} 和 {1} 之间的值”),
max: jQuery.format(“请输入一个最大为 {0} 的值”),
min: jQuery.format(“请输入一个最小为 {0} 的值”)
然后，在document的read事件中，加入如下方法：
<script>
$(document).ready(function(){
$("#signupForm").validate();
}
</script>这样，当form被提交的时候，就会根据input指定的class来进行验证了。如果失败，form的提交就会被阻止。并且，将提示信息显示在input的后面。
不过，这样感觉不好，因为验证规则侵入了我们的html代码。还有一个方式，便是使用“rules”。我们将input的那些验证用class删除掉。然后修改document的ready事件响应代码：
$(document).ready(function(){
$("#signupForm").validate({
rules:{
firstname:"required",
lastname:"required",
username:"required",
password:"required",
confirm_password:{
required:true,
equalTo:"#password"
},
email:{
required:true,
email:true
}
}
});
})这样以来，也能达到相同的效果。
那么，接下的问题，就是显示的错误提示是默认的。我们需要使用自定义的提示：
$(document).ready(function(){
$("#signupForm").validate({
rules:{
firstname:"required",
lastname:"required",
username:"required",
password:"required",
confirm_password:{
required:true,
equalTo:"#password"
},
email:{
required:true,
email:true
}
},
messages:{
firstname:"必填项",
lastname:"必填项",
username:"必填项",
password:"必填项",
confirm_password:{
required:"必填项",
equalTo:"密码不一致"
},
email:{
required:"必填项",
email:"格式有误"
}
}
});
})如果你还想在错误信息上显示特别的样式(比如字体为红色)即可通过添加：
<style type="text/css">
#signupForm label.error {
padding-left: 16px;
margin-left: 2px;
color:red;
background: url(img/unchecked.gif) no-repeat 0px 0px;
}
</style>继续添加对输入密码长度的验证规则：
