1

我试图这样做一个小时，我尝试了各种例子，但反应都一样：

$('body').append('<div id="allchecks">checkBoxes:<br />');
$('#allchecks').append('<input id="mcheck" type="checkbox"/>mainCheck<hr />');

for (var i = 0; i < 9; i++) {
    $('#allchecks').append('<input class="regCheck" type="checkbox" />regularCheck<br />');
}
$('#allchecks').append('</div>');

$('#mcheck').click(function () {
    if ($('#mcheck').is(':checked')) {
        $('.regCheck').attr('checked', 'checked');
    } else {
        $('.regCheck').removeAttr('checked');
    }
});

前 2 次尝试有效，但第二次尝试后无效。如果我在 2 次尝试后查看源代码，则会出现“ attr('checked', 'checked') ”并且还会出现“ removeAttr('checked') ”。

但不是视觉的。

有人可以解释为什么会这样吗？

4

1 回答 1

2

您应该使用.prop()布尔值：

$('#mcheck').click(function () {
    if ($('#mcheck').is(':checked')) {
        $('.regCheck').prop('checked', true);
    } else {
        $('.regCheck').prop('checked', false);
    }
});

这是同一件事的一个更短的版本：

$('#mcheck').click(function () {
    $('.regCheck').prop('checked', this.checked);
});

PS请学会缓存你的元素，而不是不断地遍历 DOM。此外，您可能想要使用change事件，而不是click.

于 2013-02-03T20:53:41.250 回答