JQuery复选框全选

JQuery复选框全选

以下是具体的代码实现

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<!--加载JQuery文件-->
		<script type="text/javascript" src="JQuery.js"></script>
		<script type="text/javascript">
			selectAll = function()
			{
     
     
				//这里的$()是JQuery函数,用于获取JQuery对象
				var flag = $("#first").prop("checked");
				//JQuery对象一般用$为开头命名,这里的JQuery对象是一个数组
				var $obj = $(".habit");
				//这里的prop方法可以对数组中的元素进行循环,这样就可以完成属性的赋值了
				$obj.prop("checked",flag);
			}
		</script>
	</head>
	<body>
		<!--勾起最上面的复选框就全选,没勾起就全不选-->
		<input type="checkbox" id="first" onclick="selectAll()" /><br>
		<input type="checkbox" class="habit" value="write" id="2" />写作<br>
		<input type="checkbox" class="habit" value="read" id="3"/>读书<br>
		<input type="checkbox" class="habit" value="listen" id="4"/>听音乐<br>
	</body>
</html>

猜你喜欢

转载自blog.csdn.net/weixin_46841376/article/details/113003442