JS实现checkbox控制全选/非全选（两种方式）

第一种：假实现，功能简单比较通用。

表头全选非全选checkbox标签

<input type="checkbox"  name="che"  id="selectAllID3" onclick="selectAll(this)" /></td>

JS事件：

//全选 反选

function selectAll(){

$$('input[type="checkbox"][chx="chx"]').each(function(i){

i.checked = $("selectAllID3").checked;

});

  }

第二种：当数据列表中的checkbox全部选中时，表头全选按钮选中。如果取消其中一个则 表头全选按钮取消选中。

List数据列表中的checkbox标签

<input type='checkbox'   onclick="checkCopy(${str.index});" id='chk2_${str.index}' trindex="${str.index}"   needSave="${ID}" chx="chx"/>

JS事件：

function checkCopy(obj){

//------------------点击子checkbox 全选 非全选--开始---------------------

var inlength=document.getElementsByTagName("input");

var count=0; //全选统计

   var num=0;   //非全选统计

for(var i=0;i < inlength.length; i++){

if(inlength[i].type =="checkbox" && inlength[i].chx=="chx"){

 if(inlength[i].checked==true) {count++;}

     if(inlength[i].checked==false){num++;}

}

}

if(count == inlength.length){

document.getElementById("selectAllID3").checked=true;

}

if(num == 0){

document.getElementById("selectAllID3").checked=true;

}

if(num > 0){

document.getElementById("selectAllID3").checked=false;

}

//------------------点击子checkbox 全选 非全选--结束---------------------

}