jquery复选框html问题

Question

我在使用某些jQuery或HTML时遇到了一些问题。

我有一些复选框。我想有一个"主要"复选框，这样当"主要"被选中时，该类别下的几个复选框就会被选中。

好吧，没关系。我是这样解决的：

    $('#extraPolish').change(function() {
    if ($("#extraPolish").is(':checked') == true) {
        $("#extraPolish_Inside").attr('checked', 'checked');
        $("#extraPolish_UnderFender").attr('checked', 'checked');
        $("#extraPolish_OverFender").attr('checked', 'checked');
        console.log('checkd');
    } else {
        $("#extraPolish_Inside").removeAttr('checked');
        $("#extraPolish_UnderFender").removeAttr('checked');
        $("#extraPolish_OverFender").removeAttr('checked');
    }
});

所以，当你选中#extraPolish时，下面的会被选中，当你删除#extraPolish上的复选框时，这些会被取消选中。

问题是，当我再次尝试检查它们时，它会显示在HTML代码中，但不会在我的Google Chrome上进行检查。

有什么想法吗？

Answer 1

正如其他人所说的那样，使用jquery 1.9 prop()是您想要的函数。attr（）做了一些不同的事情，一开始就错过了。。。

这将是我的解决方案。

$(document).ready(function () {
    $('#extraPolish').change(function() {
        $("#extraPolish_Inside").prop('checked', this.checked);
        $("#extraPolish_UnderFender").prop('checked', this.checked);
        $("#extraPolish_OverFender").prop('checked', this.checked);
        return false;
    });
});

Answer 2

尝试使用$("#extraPolish_Inside').prop('checked', true);和$("#extraPolish_Inside').prop('checked', false);而不是$("#extraPolish_Inside").attr('checked', 'checked');

编辑：jsfiddle示例-http://jsfiddle.net/rvtvr/1

Answer 3

与其完全删除checked属性，不如尝试将其简单设置为null。

$('#extraPolish_Inside').attr('checked',null); 

下面是一个简单的演示

Answer 4

请改用.prop('checked', false);和.prop('checked', true);。

$(document).ready(function () {
    $('#extraPolish').change(function() {
        if ($("#extraPolish").is(':checked') == true) {
            $("#extraPolish_Inside").prop('checked', true);
            $("#extraPolish_UnderFender").prop('checked', true);
            $("#extraPolish_OverFender").prop('checked', true);
            console.log('checkd');
        } else {
            $("#extraPolish_Inside").prop('checked', false);
            $("#extraPolish_UnderFender").prop('checked', false);
            $("#extraPolish_OverFender").prop('checked', false);
        }
        return false;
    });
});

jsFiddle示例

请参阅http://jquery.com/upgrade-guide/1.9/#attr-与prop相比，jQuery1.9和早期版本的行为有所不同。