1. 程式人生 > >jQuery的表單校驗外掛validate(轉)

jQuery的表單校驗外掛validate(轉)

今天試了一下,還是比較方便的,主要是可以與jQuery結合起來做到與HTML分離.

官網的例子裡引用了幾個js和css檔案,但只需引用jquery.validate.js這一個檔案即可.

貼個簡單的例子:

$('#EditView').validate({
             event: "keyup",
             rules:{
                 name:{required:true},
                 cosa_commodity_group_list:{required:true
}
             },
             submitHandler:function(){
                 $("#group_list > option").attr("selected","selected");
                 $(this).submit();
             }
});

1.event是觸發校驗的方式,可選值有keyup(每次按鍵時),blur(當控制元件失去焦點時),不使用這個引數時就只在按提交按鈕時觸發

2.如果在提交前還需要進行一些自定義處理使用submitHandler

引數,其它的都比較簡單,自己看看API就成了.

3.debug,如果這個引數為true,那麼表單不會提交,只進行檢查,除錯時十分方便.

4.rules,所有的檢驗規則都寫在這個引數裡面.

格式為:        ID : {rule1,rule2,...}

          (1) required: true         必輸
          (2) number: true 只能輸入數字(包括小數)
          (3) digits:true 只能輸入整數
          (4) minValue: 3 不能小於3
          (5) maxValue: 100 最大不超過100
          (6) rangeValue:[50,100] 值範圍為50-100
          (7) minLength: 5 最小長度(漢字算一個字元)
          (8) maxLength:        10 最大長度(漢字算一個字元)
          (9) rangeLength:[5,10] 長度範圍為5至10位(漢字算一個字元)
          (10) 上面的minLength, maxLength, rangeLength 這三項除了text input之外還可以用於checkbox,select這兩種控制元件
          (11) email:true 電子郵件
          (12) equalTo: "#field" 與#field值相同
          (13) dateISO:true       日期型,格式為1998/01/22         1999-12-12

5.messages,自定義錯誤資訊,格式與rules類似:

messages {
          password: {
              required: "請輸入您的密碼."
              minLength: "密碼不能小於5位.",
              maxLength: "密碼不能長於32位."
          },