js实现checkbox全选与反选
<script type="text/javascript" language="javascript"> function checkAll(id,name)//此方法用来全选和全消复选框 { var items=document.getElementsByName(name); var itemall=document.getElementById(id); for(var i=0;i<items.length;i++){ items[i].checked=itemall.checked; } } function resAll(id,name){ var items=document.getElementsByName(name); var itemall=document.getElementById(id); var ite=0; //此变量用来记录当前选中的checkbox的个数 for(var i=0;i<items.length;i++){ //获得当前选中的checkbox的数量 if(items[i].checked){ ite++; } } //如果当前选中的数量为有一个没有选中,并且全选框是选中状态 //则将全选框的状态变为不选择 if(ite==items.length-1&&itemall.checked){ itemall.checked=false; } /*--- //这个适用于你想把子选项完全去掉才将全选的效果去掉 if(ite==0&&itemall.checked){ itemall.checked=false; } ---*/ //如果当前选中的数量为零并且全选框是未选中状态 //则将全选框的状态变为选择 if(ite==items.length&&!itemall.checked){ itemall.checked=true; } } </script>
html部分
广告位位置: 全部:<input type="checkbox" id="checkall" onclick="checkAll('checkall','position[]')"> 首页:<input type="checkbox" name="position[]" value="index" onclick="resAll('checkall','position[]')"> 分类页:<input type="checkbox" name="position[]" value="category" onclick="resAll('checkall','position[]')"> 详情页:<input type="checkbox" name="position[]" value="detail" onclick="resAll('checkall','position[]')"> 播放页: <input type="checkbox" name="position[]" value="play" onclick="resAll('checkall','position[]')"><br /> 终端: 全部:<input type="checkbox" id="check" onclick="checkAll('check','terminal[]')"> 网络:<input type="checkbox" name="terminal[]" value="net" onclick="resAll('check','terminal[]')"> 机顶盒:<input type="checkbox" name="terminal[]" value="stb" onclick="resAll('check','terminal[]')"> 移动:<input type="checkbox" name="terminal[]" value="mobile" onclick="resAll('check','terminal[]')">