javascript - 一旦我删除了一个属性，我就无法添加它

Question

我正在尝试制作一个全选复选框，但是当我取消选择它并再次选择它时，它就不再选择这些框了。虽然它在第一次工作。

这是我的代码：

HTML：

<div id="Everything">
    <input type="checkbox" id="all" />Select All
    <br />
    <br />
    <div id="selectThese">
        <input type="checkbox" id="First" />First
        <br />
        <input type="checkbox" id="Second" />Second
        <br />
    </div>
</div>

JS：

$(function () {
    $("#Everything").on("click", "#all", function () {
        var carStatus = $("#all").is(':checked');
        if (carStatus == true) {
            $("#selectThese input").attr("checked", "checked");
        } else {
            $("#selectThese input").removeAttr("checked");
        }
    });
});

Jsfiddle 链接：http: //jsfiddle.net/Epsju/1/

Answer 1

你需要使用prop()它，因为它接受一个布尔值来检查和取消选中元素，你可以直接使用你的变量，或者只是放弃变量并使用this.checked：

$(function () {
    $("#Everything").on("change", "#all", function () {
        $("#selectThese input").prop("checked", this.checked);
    });
});

小提琴

Answer 2

试试这个：- 演示

$(function () {
    $("#Everything").on("change", "#all", function () {
        $('#selectThese :checkbox').prop('checked', $(this).is(':checked'));
    });
});

反之亦然

$('#selectThese :checkbox').on('change', function () {

            $('#all').prop('checked', $('#selectThese :checkbox:checked').length == $('#selectThese :checkbox').length)
        });

Answer 3

http://jsfiddle.net/Epsju/6/

也使用change你的小提琴用途#car，当它应该使用时#all。

$(function () {
    $("#Everything").on("change", "#all", function () {
        $('#selectThese :checkbox').prop('checked', $(this).is(':checked'));
    });
});