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[]')">

 

posted @ 2013-07-11 09:44  cslgpl  阅读(190)  评论(0编辑  收藏  举报