JavaScript全选(全消),动态全选全消

来源:互联网 发布:hp 3055 网络打印机 编辑:程序博客网 时间:2024/06/05 14:07
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
  <TITLE>JavaScript全选(全消),动态全选全消</TITLE>
  <script type="text/javascript" language="javascript">
   function checkAll()//此方法用来全选和全消复选框
   {
  var items=document.getElementsByName("checkC");
  var itemall=document.getElementById("all");
  for(var i=0;i<items.length;i++){
    items[i].checked=itemall.checked;
  }
   }
   function resAll(){
  var items=document.getElementsByName("checkC");
  var itemall=document.getElementById("all");
  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>
</HEAD>
<BODY>
此脚本适合由数据库动态创建时使用这样的,因为里面不需要传递参数。因此扩展性不是很高<br/>
  <input type="checkbox" name="all" id="all" onclick="checkAll()">全选

  <input type="checkbox" name="checkC" onclick="resAll()">1

  <input type="checkbox" name="checkC" onclick="resAll()">2

  <input type="checkbox" name="checkC" onclick="resAll()">3

  <input type="checkbox" name="checkC" onclick="resAll()">4

  <input type="checkbox" name="checkC" onclick="resAll()">5

  <input type="checkbox" name="checkC" onclick="resAll()">6

  <input type="checkbox" name="checkC" onclick="resAll()">7

</BODY>
</HTML>
希望高手们不要砸我就好了!
原创粉丝点击