jQuery - 限制选中复选框的数量

我有一堆复选框，我真的希望让用户只能选择upto 5.一旦选择了5，那么其他人就会被禁用。jQuery - 限制选中复选框的数量

的HTML标记是：

<ul class="options-list"> 
<li> 
    <input type="checkbox" value="259" name="bundle_option[9][]" id="bundle-option-9-259" class="change-container-classname checkbox bundle-option-9"> 
    <span class="label"><label for="bundle-option-9-259">1 x Test 1</label></span> 
</li> 
<li> 
    <input type="checkbox" value="260" name="bundle_option[9][]" id="bundle-option-9-260" class="change-container-classname checkbox bundle-option-9"> 
    <span class="label"><label for="bundle-option-9-260">1 x Test 1</label></span> 
</li> 
<li> 
    <input type="checkbox" value="261" name="bundle_option[9][]" id="bundle-option-9-261" class="change-container-classname checkbox bundle-option-9"> 
    <span class="label"><label for="bundle-option-9-261">1 x Test 1</label></span> 
</li> 
<li> 
    <input type="checkbox" value="262" name="bundle_option[9][]" id="bundle-option-9-262" class="change-container-classname checkbox bundle-option-9"> 
    <span class="label"><label for="bundle-option-9-262">1 x Test 1</label></span> 
</li> 
<li> 
    <input type="checkbox" value="263" name="bundle_option[9][]" id="bundle-option-9-263" class="change-container-classname checkbox bundle-option-9"> 
    <span class="label"><label for="bundle-option-9-263">1 x Test 1</label></span> 
</li> 
<li> 
    <input type="checkbox" value="264" name="bundle_option[9][]" id="bundle-option-9-264" class="change-container-classname checkbox bundle-option-9"> 
    <span class="label"><label for="bundle-option-9-264">1 x Test 1</label></span> 
</li> 
</ul>

我的主要问题是目标的复选框。

我可以使用name的值bundle_option[9][]作为目标吗？

感谢

来源

2012-01-13 terrid25

当然可以，但因为你的名字[和]的（这在jQuery选择一个特殊的意思），你有\\以躲开他们。（taken from API docs）;

如果你希望使用任何的元字符（如“＃$％&“（）* +，/ :; < => @ [] ^`！？{|}〜）作为名称的文本部分，则必须使用两个反斜杠逃脱字符：\

$(':checkbox[name="bundle_option\\[9\\]\\[\\]"]');

见http://jsfiddle.net/G9JCw/

来源

2012-01-13 10:18:29 Matt

啊，我知道这是类似的东西。我只是忘了我需要转义每个括号。谢谢！！ – terrid25 2012-01-13 10:32:17

您可以使用检查选择抢选择复选框一样，

$("input[name='bundle_option[9][]']:checked")

来源

2012-01-13 10:24:58 rahool

试试这个：

$(".checkbox").change(function() { 
    var count = $(".checkbox:checked").length; 
    if (count >= 5) { 
     $(".checkbox").not(":checked").prop("disabled", "disabled"); 
    } 
    else{ 
     $(".checkbox").removeProp("disabled"); 
    } 
});

Example fiddle

来源

2012-01-13 10:25:09

jQuery - 限制选中复选框的数量

回答

相关问题