javascript - 检查父复选框不会检查子复选框

Question

我试图让一些 jquery 在选择父项时检查子项复选框，但是它没有发生，我一生都无法弄清楚到底是什么。

代码:

$('#check-all-parent').click(function(event) {
if(this.checked) { // check select status
    $('#check-all-child').each(function() { //loop through each checkbox
        this.checked = true;  //select all checkboxes with class "checkbox1"               
    });
}else{
    $('#check-all-child').each(function() { //loop through each checkbox
        this.checked = false; //deselect all checkboxes with class "checkbox1"                       
    });         
}  
});

HTML:

<input type="checkbox" id="check-all-parent">hello
<br />
<input type="checkbox" id="check-all-child">hello2

这是jsfidle

Answer 1

使用类而不是 id。

HTML

<input type="checkbox" id="check-all-parent">hello
<br />
<input type="checkbox" class="check-all-child">hello2

jQuery

$('#check-all-parent').click(function(event) {
if(this.checked) { // check select status
    $('.check-all-child').each(function() { //loop through each checkbox
        this.checked = true;  //select all checkboxes with class "checkbox1"               
    });
}else{
    $('.check-all-child').each(function() { //loop through each checkbox
        this.checked = false; //deselect all checkboxes with class "checkbox1"                       
    });         
}