设置一个全选选框和四个子选框,要实现点击全选后四个子选框选中,取消全选后四个子选框也取消。全选后点击某个子选框,全选也能取消。当四个子选框都选中时,全选框也被选择。
实现代码:
<script>
var a=document.getElementById("a");
var b=document.getElementsByClassName("b");
//全选与取消全选
var y=true;
a.οnchange=function(){
if(a.checked){
for (var i=0;i<b.length;i++)
b[i].checked = true;
}else{
for (var i=0;i<b.length;i++) {
b[i].checked =false;
};
};
};
//子选框选择判定全选选框(第一种实现方法)
for (var i=0;i<b.length;i++) {
b[i].οnchange=function(){
a.checked = true;
for (var i=0;i<b.length;i++) {
if (!b[i].checked) {
a.checked=false;
break;
}
}
}
}
//子选框选择判定全选(第二种实现方法)
// var n = 0;
// for (var i=0;i<b.length;i++) {
// b[i].οnchange=function(){
// n = 0;
// for(var i = 0; i < b.length; i++)
// {
// if(b[i].checked==true){
// n++;
// }
// if(n>=4){
// alert(n);
// a.checked = true;
// } else{
// a.checked = false;
// }
//
// }
// }
//}