jquery - 复选框不起作用，并且始终未选中

Question

当我单击其他复选框之一时，我习惯 $('#checkbox_all').attr('checked', false);取消 选中。$('#checkbox_all')它工作正常，但是当我单击$('#checkbox_all')它时不会被检查。

所以$('#checkbox_all')不知何故不能正常工作，它总是未经检查。

我错过了什么？如何解决？

谢谢！

$(document).ready(function () {

        $('#checkbox_all').attr('checked', true);

        $('input[id^="checkbox_"]').click(function () {
            $('#checkbox_all').attr('checked', false);
        });

        $('#checkbox_all').click(function () {
            alert("!!!");
        });
    });

Answer 1

使用prop代替attr：

$('#checkbox_all').prop('checked', true);

prop处理 DOM 的属性，而属性处理属性及其值。要使用 attr，它会改变属性而不是 DOM 的checked变量，你可以这样做：

$('#checkbox_all').attr('checked', "checked");

然后，您可以使用 jQuery 找到所有选中的复选框.is( condition )，如下所示：

$('#someCheckBox').is(":checked"); // returns true false

或者：

$('#someCheckBox').prop("checked"); // returns true false

此外，在单击时，您正在更改 的属性#checkbox_all，您不想更改所有其他复选框的属性吗？像这样：

$("input[type=checkbox]")

Answer 2

#checkbox_all包含在$('input[id^="checkbox_"]')选择器中，因此被告知取消选中 onclick。

Answer 3

单击任何复选框时，即使它是 checkbox_all，您也将 checkbox_all 设置为 false。此外，如果您使用的是 jQuery 1.7，则应该使用prop()而不是attr()。试试这个：

$(document).ready(function () {
    $('#checkbox_all').prop('checked', true);

    $('input[id^="checkbox_"][id!=checkbox_all]').click(function () {
        $('#checkbox_all').prop('checked', false);
    });

    $('#checkbox_all').click(function () {
        alert("!!!");
    });
});