1.选中全选复选框,则其他的复选框自动全部选中;
2.已选中全选复选框,再次点击全选复选框,则其他复选框全部不选中;
3.当全部其他复选框都被选中时,全选复选框自动被选中;
4.当全部其他复选框没有被全部选中时,全选复选框不被选中。
效果截图如下:
<body> <input type="checkbox" name="checkbox" value="Car" οnclick="isSelectAll()">I am manman <br> <input type="checkbox" name="checkbox" value="Car" οnclick="isSelectAll()">I am manman <br> <input type="checkbox" name="checkbox" value="Car" οnclick="isSelectAll()">I am manman <br> <input type="checkbox" name="checkbox" value="Car" οnclick="isSelectAll()">I am manman <br> <input type="checkbox" name="checkbox" value="Car" οnclick="isSelectAll()">I am manman <br> <input type="checkbox" name="checkbox" value="Car" οnclick="isSelectAll()">I am manman <br> <input type="checkbox" name="" value="all" id="all" οnclick="selectAll()">全选 <br> </body> <script> function selectAll(){//全选复选框控制其他复选框 var checkBoxList = document.getElementsByName("checkbox"); var allSelect = document.getElementById("all"); if(allSelect.checked){ for(var i=0;i<checkBoxList.length;i++){ checkBoxList[i].checked="checked"; } }else{ for(var i=0;i<checkBoxList.length;i++){ checkBoxList[i].checked=""; } } } function isSelectAll(){//其他复选框控制全选复选框 var checkBoxList = document.getElementsByName("checkbox"); var allSelect = document.getElementById("all"); var allSelectFlag = true; for(var i=0;i<checkBoxList.length;i++){ if(!checkBoxList[i].checked){ allSelectFlag = false; } } if(allSelectFlag){ allSelect.checked="checked"; }else{ allSelect.checked=""; } } </script>
