Question

我希望有一个应用程序，用户可以为任意个人输入数据。每个人最多可以选择六种选择中的三种。我想知道如何在任何个人身上使用jquery强制最多三个选择。

这是一个示例代码

<div id="subscriber_1">
   <input type=checkbox name=national>
   <input type=checkbox name=international>
   <input type=checkbox name=business>
   <input type=checkbox name=entertainment>
   <input type=checkbox name=religion>
   <input type=checkbox name=sports>
</div>

订阅者最多可以运行20个，例如subscriber_1，subscriber_2，... subscriber_20。我将非常感谢你的帮助。

Answer 1

您应该向订阅者div添加一个类，以便更容易附加事件处理程序：

<div id="subscriber_1" class="subscriber">...</div>
<div id="subscriber_2" class="subscriber">...</div>

使用这个jQuery：

$('.subscriber :checkbox').change(function () {
    var $cs = $(this).closest('.subscriber').find(':checkbox:checked');
    if ($cs.length > 3) {
        this.checked = false;
    }
});

jsFiddle Demo

说明：在这些复选框的更改事件中，我们查找具有类.subscriber的最近父级。我们在这个div中得到了选中的复选框。如果有超过3个（当前已检查的那个也计数），我们取消选中当前的那个。

如果您当然不想添加类，则可以使用此选择器：

$('[id^="subscriber_"] :checkbox')...

这称为Attribute Starts With Selector。

分组复选框，允许每组最多检查三个

1 个答案: