使用jQuery做核取方塊的全選與取消

My_name_is_ZwZ發表於2018-10-28
jQuery
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<input type="checkbox"  id="qx"  />全選<br>
		<input type="checkbox" class="abc" /><br />
		<input type="checkbox" class="abc" /><br />
		<input type="checkbox" class="abc" /><br />
	</body>
	<script type="text/javascript">
		$("#qx").click(function(){
            //得到id="qx"的標籤的checked屬性的值
			var x= $("#qx").prop('checked');
            //將class屬性為.abc的標籤的checked屬性設定成x
			$(".abc").prop('checked',x);	
		})
	</script>
</html>

其中的下邊這句程式碼可以做更換：

$(".abc").prop('checked',x);

 上邊這行程式碼可以更換為：

//迴圈遍歷class屬性為.abc的標籤
$(".abc").each(function(){
	//this表示每次遍歷到的標籤
	$(this).prop('checked',x);
})

 

相關文章