全选/全不选

html部分

<body>
	 <input type="checkbox" name="checkItems"  id="checkItems" value="全选/全不选"/>
        全选/全不选
	 <br>
        <input type="checkbox" name="items" value="足球" />足球
		<input type="checkbox" name="items" value="篮球" />篮球
		<input type="checkbox" name="items" value="游泳"/>游泳
		<input type="checkbox" name="items" value="唱歌"/>唱歌
</body>

js部分

document.getElementById("checkItems").onclick = function(){
//	 	if(this.checked){
//			var items = document.getElementsByName("items");
//			for(var i=0;items!=null && i<items.length;i++){
//			    var item = items[i];
//				item.checked = true;
//			}
//		}
//		else{
//			var items = document.getElementsByName("items");
//			for(var i=0;items!=null && i<items.length;i++){
//			    var item = items[i];
//				item.checked = false;
//			}
//		}
		//简便方法
		var items = document.getElementsByName("items");
		for(var i=0;items!=null && i<items.length;i++){
			var item = items[i];
			item.checked = this.checked;
            //反选
                item.checked = !item.checked;
		}
	 }

猜你喜欢

转载自blog.csdn.net/qq_38362772/article/details/84930109