jquery.validate自定義規則
// 字元驗證 jQuery.validator.addMethod("stringCheck", function(value, element) {
returnthis.optional(element) ||/^[\u0391-\uFFE5\w]+$/.test(value);
}, "只能包括中文字、英文字母、數字和下劃線");
//加點說明。通過addMethod使用者可以自定義自己的驗證規則
如上面的增加的jQuery.validator.addMethod("stringCheck", function(value, element) {
這個方法,應該放在那裡,個人認為,只要放在<script></script>之間就可以,前提你要引入jquery validate 的包
這個方法有三個引數,第一個引數表示驗證規則名稱,這裡是stringCheck
第二個引數是真正的驗證主體,它是一個函式,函式的第一個value表示呼叫這個驗證規則的表單的值,第二個element可以用來判斷是否為空,為空的時候,就不呼叫這個驗證規則了。
第三個引數是返回的錯誤提示。
// 中文字兩個位元組 jQuery.validator.addMethod("byteRangeLength", function(value, element, param) {
var length = value.length;
for(var i =0; i <
if(value.charCodeAt(i) >127){
length++;
} }returnthis.optional(element) || ( length >= param[0] && length <= param[1] );
}, "請確保輸入的值在3-15個位元組之間(一箇中文字算2個位元組)");
// 身份證號碼驗證 jQuery.validator.addMethod("isIdCardNo", function
returnthis.optional(element) || isIdCardNo(value);
}, "請正確輸入您的身份證號碼");
// 手機號碼驗證
jQuery.validator.addMethod("isMobile", function(value, element) {
var length = value.length;
var mobile =/^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
returnthis.optional(element) || (length ==11&& mobile.test(value));
}, "請正確填寫您的手機號碼");
// 電話號碼驗證
jQuery.validator.addMethod("isTel", function(value, element) {
var tel =/^\d{3,4}-?\d{7,9}$/; //電話號碼格式010-12345678 returnthis.optional(element) || (tel.test(value));
}, "請正確填寫您的電話號碼");
// 聯絡電話(手機/電話皆可)驗證
jQuery.validator.addMethod("isPhone", function(value,element) {
var length = value.length;
var mobile =/^(((13[0-9]{1})|(15[0-9]{1}))+\d{8})$/;
var tel =/^\d{3,4}-?\d{7,9}$/;
returnthis.optional(element) || (tel.test(value) || mobile.test(value));
}, "請正確填寫您的聯絡電話");
// 郵政編碼驗證
jQuery.validator.addMethod("isZipCode", function(value, element) {
var tel = /^[0-9]{6}$/;
return this.optional(element) || (tel.test(value));
}, "請正確填寫您的郵政編碼");
//開始驗證
$('#submitForm').validate({
/* 設定驗證規則 */ rules: {
username: {
required:true,
stringCheck:true,
byteRangeLength:[3,15]
},
email:{
required:true,
email:true },
phone:{
required:true,
isPhone:true },
address:{
required:true,
stringCheck:true,
byteRangeLength:[3,100]
} },
/* 設定錯誤資訊 */ messages: {
username: {
required: "請填寫使用者名稱",
stringCheck: "使用者名稱只能包括中文字、英文字母、數字和下劃線",
byteRangeLength: "使用者名稱必須在3-15個字元之間(一箇中文字算2個字元)" },
email:{
required: "請輸入一個Email地址",
email: "請輸入一個有效的Email地址" },
phone:{
required: "請輸入您的聯絡電話",
isPhone: "請輸入一個有效的聯絡電話" },
address:{
required: "請輸入您的聯絡地址",
stringCheck: "請正確輸入您的聯絡地址",
byteRangeLength: "請詳實您的聯絡地址以便於我們聯絡您" }
},