jQuery驗證插件：驗證複選框

Question

我使用jQuery驗證插件來驗證複選框，因爲它沒有默認選項，應該選擇一個，並且最多可以選擇兩個複選框，這些是標準。我沒有收到任何錯誤，也沒有驗證。我像下面這樣擴展它，

<input type="checkbox" name="test[]" />x 
    <input type="checkbox" name="test[]" />y 
    <input type="checkbox" name="test[]" />z 
    $("#formid").validate({ 
    rules: { 
    test[]: { 

      required: function(elem) 
      { 
       return $("input.select:checked").length > 0; 
      } 

      }, 
messages: { 

    test[]: "You must check at least 1 box" 
    } 
}); 

Answer 1

你的代碼有幾個問題。

1）缺失大括號}，在您的rules內。

2）在這種情況下，沒有理由對required規則使用函數。默認情況下，插件可以處理checkbox和radio輸入就好了，所以使用true就足夠了。但是，這隻會執行與原始函數相同的邏輯，並驗證至少有一個已被選中。

3）如果您還只希望檢查最多兩個，那麼您需要應用maxlength規則。

4）messages選項缺少規則規範。它會起作用，但是一個自定義消息將適用於同一領域的所有規則。

5）如果一個name屬性包含括號，you must enclose it within quotes。

DEMO：http://jsfiddle.net/K6Wvk/

$(document).ready(function() { 

    $('#formid').validate({ // initialize the plugin 
     rules: { 
      'test[]': { 
       required: true, 
       maxlength: 2 
      } 
     }, 
     messages: { 
      'test[]': { 
       required: "You must check at least 1 box", 
       maxlength: "Check no more than {0} boxes" 
      } 
     } 
    }); 

}); 

Answer 2

有最簡單的方式

HTML：

<input type="checkbox" name="test[]" />x 
<input type="checkbox" name="test[]" />y 
<input type="checkbox" name="test[]" />z 
<button type="button" id="submit">Submit</button> 

JQUERY：

$("#submit").on("click",function(){ 
    if (($("input[name*='test']:checked").length)<=0) { 
     alert("You must check at least 1 box"); 
    } 
    return true; 
}); 

爲此，您不需要任何插件。 享受;）