js的全选反选(两组复选框)

JavaScript024

js的全选反选(两组复选框),第1张

参考下

<meta http-equiv="content-type"content="text/htmlcharset=utf-8">

<body>

<!--把下面代码加到<body>与</body>之间-->

<script language="Javascript">

functioncc(N,bool){

varaa = document.getElementById(N).getElementsByTagName("input")

for(vari=0i<aa.lengthi++){

if(aa[i].type=="checkbox")

aa[i].checked = bool==1 ? true: (bool==0 ? false: !aa[i].checked)

}

}

</script>

<form id="form1">

<input type="checkbox"name="c1"><br>

<input type="checkbox"name="c2"><br>

<input type="checkbox"name="c3"><br>

<input type="checkbox"name="c4"><br>

<input type="checkbox"name="c5"><br>

<a href="#"onclick="cc('form1',1)">全选</a><a href="#"onclick="cc('form1',0)">全不选</a><a href="#"onclick="cc('form1',2)">反选</a>

</form>

<form id="form2">

<input type="checkbox"name="c11"><br>

<input type="checkbox"name="c12"><br>

<input type="checkbox"name="c13"><br>

<input type="checkbox"name="c14"><br>

<a href="#"onclick="cc('form2',1)">全选</a><a href="#"onclick="cc('form2',0)">全不选</a><a href="#"onclick="cc('form2',2)">反选</a>

</form>

<form id="form3">

<input type="checkbox"name="c19"><br>

<input type="checkbox"name="c21"><br>

<input type="checkbox"name="c31"><br>

<a href="#"onclick="cc('form3',1)">全选</a><a href="#"onclick="cc('form3',0)">全不选</a><a href="#"onclick="cc('form3',2)">反选</a>

</form>

</body>

</html>

CheckBox复选框JS实现全选全不选功能,很简单，就只需插入一小段js函数就行了。。。

<script language="javascript">

  function cli(Obj)

  {

  //获取控制其它复选框的对象obj

  var collid = document.getElementByIdx_x("all")

  //获取需要全选，全不选功能的所有复选框

  var coll = document.getElementsByName(Obj)

  //如果obj被选中，则全选

  if (collid.checked){

     //循环设置所有复选框为选中状态

     for(var i = 0 i < coll.length i++)

       coll[i].checked = true

  }else{//取消obj选中状态，则全不选

     //循环设置所有复选框为未选中状态

     for(var i = 0 i < coll.length i++)

       coll[i].checked = false

  }

  }

  </script>

----------------------------------------------------

下面是一组CheckBox复选框html代码

----------------------------------------------------

<input name='多选项名称' type='checkbox' value='' id="all"  onclick="cli('多选项名称')">  全选

<input name='多选项名称' type='checkbox' value='' >  A

<input name='多选项名称' type='checkbox' value='' >  B

<input name='多选项名称' type='checkbox' value='' >  C

<input name='多选项名称' type='checkbox' value='' >  D

<input name='多选项名称' type='checkbox' value='' >  E

<input name='多选项名称' type='checkbox' value='' >  F

----------------------------------------------------