1. 程式人生 > >jquery.validate自定義規則

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 <

 value.length; i++){       
if(value.charCodeAt(i) >127){       
        length++;       
        }
   }
returnthis.optional(element) || ( length >= param[0&& length <= param[1] );       
}"請確保輸入的值在3-15個位元組之間(一箇中文字算2個位元組)");   
// 身份證號碼驗證       jQuery.validator.addMethod("isIdCardNo"function
(value, element) {       
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: "請詳實您的聯絡地址以便於我們聯絡您"
       }   

    },