jquery全選和反選

$(function(){
	//全選
	$("#ckbAll").click(function(){
			//獲取到全選狀態
			var status=$(this).prop("checked");
			//遍歷將所有的checkbox狀態改變成ckbAll的狀態
			$("[name='ckb']").each(function(index,item){
				$(item).prop("checked",status);
			})
		});
		//反選,爲所有的ckb註冊點擊事件
		$("[name='ckb']").click(function(){
			//初始化狀態
			var status=true;
			//當點擊一個ckb、時,遍歷所有的ckb,有一個未被選中,ckbAll爲false
			$("[name='ckb']").each(function(index,item){
				if(!$(item).prop("checked")){
					status=false;
					return;
				}
			});
			//替換ckbAll的選中狀態
			$("#ckbAll").prop("checked",status);
		})
})
	
<body>
	<input type="checkbox" id="ckbAll"/><br/>
	<input type="checkbox" name="ckb"/><br/>
	<input type="checkbox" name="ckb"/><br/>
	<input type="checkbox" name="ckb"/><br/>
	<input type="checkbox" name="ckb"/><br/>
	<input type="checkbox" name="ckb"/><br/>
</body>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章