JS 实现checkbox 全选全不选_js checkbox选中和不选中-CSDN博客

/**
 * 全选
 */
function selectAll(){
	var oInput=document.getElementsByName("cartCheckBox");
        for (var i=0;i<oInput.length;i++){
            oInput[i].checked=document.getElementById("allCheckBox").checked;
	}
}

/**
 * 单选
 */
function selectSingle(){
	var k=0;
	var oInput=document.getElementsByName("cartCheckBox");
	 for (var i=0;i<oInput.length;i++){
	   if(oInput[i].checked==false){
		  k=1;
		  break;
	    }
	}
	if(k==0){
		document.getElementById("allCheckBox").checked=true;
		}
	else{
		document.getElementById("allCheckBox").checked=false;
		}
}

页面

<html>
<head>
<script>
function selectAll(){
 var checklist = document.getElementsByName ("cartCheckBox");
   for(var i=0;i<checklist.length;i++)
   {
      checklist[i].checked = document.getElementById("allCheckBox").checked;
   } 
}

function selectSingle(){
   var checklist = document.getElementsByName ("cartCheckBox");
   var k = 0;
   for(var i=0;i<checklist.length;i++){
	if(checklist[i].checked == false){
	   k++;
	   break;
	}
   }
   if(k > 0){
	document.getElementById("allCheckBox").checked=false;
   }else{
	document.getElementById("allCheckBox").checked=true;
   }
}
</script>
</head>
<body>
<form>
<input οnclick="selectAll()" type="checkbox"   name="allCheckBox" style="allCheckBox" id="allCheckBox"/>全选<br>
1:<input type="checkbox" name="cartCheckBox" value="1" οnclick="selectSingle()"/><br>
2:<input type="checkbox" name="cartCheckBox" value="2" οnclick="selectSingle()"/><br>
3:<input type="checkbox" name="cartCheckBox" value="3" οnclick="selectSingle()"/><br>
4:<input type="checkbox" name="cartCheckBox" value="4" οnclick="selectSingle()"/><br>
5:<input type="checkbox" name="cartCheckBox" value="5" οnclick="selectSingle()"/><br>
6:<input type="checkbox" name="cartCheckBox" value="6" οnclick="selectSingle()"/><br>
</form>
</body>
</html>