Установите все флажки, отмеченные в jQuery

Question

Мой HTML Dom похож на следующие:

<div class="menu">
   <input type="checkbox" value="1" class="chk-act">
   <input type="checkbox" value="2" class="chk-act">
   <input type="checkbox" value="3" class="chk-act">
</div>


<div class="menu">
   <input type="checkbox" value="4" class="chk-act">
   <input type="checkbox" value="5" class="chk-act">
   <input type="checkbox" value="6" class="chk-act">
   <input type="checkbox" value="7" class="chk-act">
</div>



<div class="menu">
   <input type="checkbox" value="8" class="chk-act">
   <input type="checkbox" value="9" class="chk-act">
</div>

Количество флажков не фиксировано в каждом div.Это может быть от 1 до 50. Поэтому мне нужно проверять каждый div, если все флажки отмечены, тогда некоторые изменения в стиле div, например, изменили цвет, как вы предлагаете проверить все флажки, отмеченные флажком?

Answer 1

В одну строку:

$('.menu:has(:checkbox:not(:checked))');

Для объяснения, это будет выбирать все элементы <div class="menu">, которые имеют внутри них, флажок, который не был отмечен.Затем вы можете добавить класс CSS или делать все, что вам нужно.Если вам нужно «сбросить» их после добавления класса, я бы сделал что-то вроде этого:

$('.menu')
    .removeClass('notChecked')
    .filter(':has(:checkbox:not(:checked))')
    .addClass('notChecked');