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

我有一堆复选框，我真的想让用户只能选择多达5个。一旦选择了5，其他的则被禁用

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>

1 x测试1


1 x测试1


1 x测试1


1 x测试1


1 x测试1


1 x测试1

我的主要问题是针对复选框

我可以使用

bundle\u选项[9][

的

name

值将它们作为目标吗

---

谢谢

是的，您可以，但是因为名称中有

[

和

]

（在jQuery选择器中有特殊含义），您必须使用

\

来转义它们；();

如果希望将任何元字符（例如！“$%”和“（）*+，./：；？@[]^`{124;}~）用作名称的文字部分，则必须使用两个反斜杠转义该字符：\

---

请参见

您可以使用选中的选择器抓取选中的复选框，如

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

试试这个：

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

---

啊，我就知道是这样的。我只是忘记了我需要逃离每个括号。谢谢！！

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