Java练习源码03_使用Javascript实现“全选”按钮

界面:
在这里插入图片描述
在这里插入图片描述
源码:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript">
			function func(){
				var isAll = document.getElementById("selectAll").checked;
				var checks = document.getElementsByName("check");
				for(var i=0;i<checks.length;i++){
					checks[i].checked = isAll;
				}
			}
		</script>
	</head>
	<body>
		<img src="img/task3/head.jpg" /><br />
		<table  rules="rows"  cellpadding="20px" cellspacing="0px">
			<tr>
				<td bor>
					<input type="checkbox" id="selectAll" οnchange="func()" />全选
				</td>
				<td>
					<img src="img/task3/top.jpg" />
				</td>
			</tr>
			<tr>
				<td>
					<input type="checkbox" name="check" value="01" />
				</td>
				<td><img src="img/task3/one.jpg" /></td>
			</tr>
			<tr>
				<td>
					<input type="checkbox" name="check" value="02" />
				</td>
				<td><img src="img/task3/two.jpg" /></td>
			</tr>
			<tr>
				<td>
					<input type="checkbox" name="check" value="03" />
				</td>
				<td><img src="img/task3/three.jpg" /></td>
			</tr>
			<tr>
				<td>
					<input type="checkbox" name="check" value="04" />
				</td>
				<td><img src="img/task3/four.jpg" /></td>
			</tr>
		</table>
	</body>
</html>

发布了34 篇原创文章 · 获赞 7 · 访问量 2198

猜你喜欢

转载自blog.csdn.net/qq_37717494/article/details/104515156
今日推荐