jquery-validate插件已经是我最常用的插件之一,真的是好用和方便。
1.包含Jquery和jquery-validate.js文件;
2.在$(document).ready中加入,开启验证
$()
.ready( function() {
// validate the comment form when it is submitted
$("#commentForm").validate();}
3.在字段中描述验证信息,有多种方式
a).
<input id="cemail" name="email" class="required email" />
class中可以放
required: {required: true} email: {email: true} url: {url: true} date: {date: true} dateISO: {dateISO: true} dateDE: {dateDE: true} number: {number: true} numberDE: {numberDE: true} digits: {digits: true} creditcard: {creditcard: true}
不可以对radio以及checkbox等进行操作
b).
$("#signupForm")
.validate(
{
rules : {
firstname :"required",
lastname :"required",
username : {
required :true,
minlength :2
},
password : {
required :true,
minlength :5
},
confirm_password : {
required :true,
minlength :5,
equalTo :"#password"
},
email : {
required :true,
email :true
},
topic : {
required :"#newsletter:checked",
minlength :2
},
agree :"required"
},
messages : {
firstname :"<fmt:message key="user.missing"/>",
lastname :"Please enter your lastname",
username : {
required :"Please enter a username",
minlength :"Your username must consist of at least 2 characters"
},
password : {
required :"Please provide a password",
minlength :"Your password must be at least 5 characters long"
},
confirm_password : {
required :"Please provide a password",
minlength :"Your password must be at least 5 characters long",
equalTo :"Please enter the same password as above"
},
email :"Please enter a valid email address",
agree :"Please accept our policy"
}
});
c).在field中进行声明(这种方式更好)
<input type="radio" id="family_single" value="s" name="family" validate="required:true" />