групповые флажки и позволяют проверить не более трех в каждой группе

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... подписчик_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

Объяснение: В событии change этих флажков мы ищем ближайшего родителя с классом .subscriber. Мы получаем проверенные флажки внутри этого div. Если их больше 3 (текущее значение также считается), мы снимаем галочку с текущего.

---

Если вы, конечно, не хотите добавлять классы, вместо этого вы можете использовать этот селектор:

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

Это называется Атрибут начинается с селектора .