版权声明:本文为博主原创文章,未经博主允许不得转载。否则,吔屎伺候。 https://blog.csdn.net/guowujun321/article/details/80774338
/**
* 父级复选框:input内加入 parent-check
* 子级复选框:input内加入 child-check
*/
$("[parent-check]").bind("click",function() {
if (this.checked) {
$("[child-check]").prop("checked", true);
} else {
$("[child-check]").prop("checked", false);
}
});
$("[child-check]").bind("click",function(){
if (!this.checked){
$("[parent-check]").prop("checked", false);
} else {
var i = 0;
$("[child-check]").each(function(){
if($(this).is(":checked")) {
i = i + 1;
}
});
var trLength = $("tbody").find("tr").length;
if (i == trLength){
$("[parent-check]").prop("checked", true);
}
}
});
应用场景如下图:
html代码
<tr>
<th>
<input type="checkbox" parent-check />
</th>
</tr>
<tbody>
<tr>
<td>
<input type="checkbox" child-check />
</td>
</tr>
</tbody>
全勾选子复选框时,父级复选框自动勾选。