<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
全选<input type="checkbox" class="all">
<input type="checkbox" class="item">
<input type="checkbox" class="item">
<input type="checkbox" class="item">
<input type="checkbox" class="item">
<script>
var cbAll=document.querySelector(".all");
var items=document.querySelectorAll(".item");
var falseCount = 4;//没有被选中的个数
cbAll.onchange=function () { //监听全选框
for(let i=0;i<items.length;i++){
items[i].checked=cbAll.checked;
}
/ if(falseCount=cbAll.checked){
falseCount=0; //如果全部被选中,则falseCount=0
}else {
falseCount=4;//否则falseCount=4
}/
falseCount=cbAll.checked ? 0: 4;
}
//监听其他框
for(let i=0;i<items.length;i++){
items[i].onchange=function () {
!items[i].checked ? falseCount++ : falseCount--;
cbAll.checked=falseCount==0 ? true : false;
}
}
</script>
</body>
</html>
网友评论