Проверка нескольких флажков в отдельных div с помощью JQuery

Question

У меня есть несколько флажков, распределенных по двум элементам.Два элемента div содержатся в элементе div, называемом действиями.В отдельном div у меня есть флажок «выбрать все».Когда этот флажок установлен, я пытаюсь выбрать все остальные, а когда вы снимаете флажок «выбрать все», он отменяет выбор других.

Это HTML:

<div class="actions" id="actions" title="Actions">
    <div>
        <div><input type="checkbox" name="action" class="act" value="0" /> <?php echo $lang["actions"][0]; ?></div><br />
        <div><input type="checkbox" name="action" class="act" value="1" /> <?php echo $lang["actions"][1]; ?></div><br />
        <div><input type="checkbox" name="action" class="act" value="2" /> <?php echo $lang["actions"][2]; ?></div><br />
        <div><input type="checkbox" name="action" class="act" value="3" /> <?php echo $lang["actions"][3]; ?></div><br />

    </div>
    <div>
        <div><input type="checkbox" name="action" class="act" value="26" /> <?php echo $lang["actions"][26]; ?></div><br />
        <div><input type="checkbox" name="action" class="act" value="27" /> <?php echo $lang["actions"][27]; ?></div><br />
        <div><input type="checkbox" name="action" class="act" value="28" /> <?php echo $lang["actions"][28]; ?></div><br />
        <div><input type="checkbox" name="action" class="act" value="29" /> <?php echo $lang["actions"][29]; ?></div><br />
        <div><input type="checkbox" name="action" class="act" value="30" /> <?php echo $lang["actions"][30]; ?></div><br />
        <div><input type="checkbox" name="action" class="act" value="31" /> <?php echo $lang["actions"][31]; ?></div>
    </div>
</div>
<div class="parameters1">
    <div class="selectAll" title="Select All"><input type="checkbox" id="selectAll" name="selectall" /> Select All</div>
</div>

Вот мой JQuery:

$(".selectAll").click(function() {
        var checked_status = this.checked;
        $('#actions').find("input").each(function() {
            $(this).attr(":checked", checked_status);
        });
});

Если я помещаю alert () внутри каждой функции, он правильно видит каждый флажок, однако бит $ (this) .attrне похоже, что на самом деле меняется флажок.

Есть идеи?

Answer 1

Вы неправильно устанавливаете атрибут:

    $(this).prop("checked", checked_status);

Начиная с версии jQuery версии 1.6, для этой цели предпочтение отдается .prop (), а не .attr (), хотя для логического атрибута / свойства, такого как "флажок", функция ".attr ()" будет все еще работают. Имя атрибута не требует ":" на передней панели, и фактически это приведет к сбою операции, поскольку свойство, которое вы хотите обновить, на самом деле называется "флажок", без ":".

Также вам не нужен явный ".each ()"; это должно работать нормально, чтобы сделать:

    $('#actions input').prop('checked', checked_status);