1、代码实现
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
</head>
<body>
<script type="text/javascript">
window.onload = function() {
var first = document.getElementById("first"); //获取
var aihaos = document.getElementsByName("A"); //通过name获取
first.onclick = function() {
for(var i = 0; i < aihaos.length; i++) {
aihaos[i].checked = first.checked;
}
}
//当复选框全部选中的时候第一个复选框才会显示选中
var all = aihaos.length;
for(var i = 0; i < aihaos.length; i++) {
aihaos[i].onclick = function() {
var currentsum = 0;
for(var i = 0; i < aihaos.length; i++) {
if(aihaos[i].checked) {
currentsum++;
}
}
first.checked = (currentsum == all);
}
}
}
</script>
<input type="checkbox" id="first" /><br />
<input type="checkbox" name="A" value="smoke" />吸烟<br />
<input type="checkbox" name="A" value="drink" />喝酒<br />
<input type="checkbox" name="A" value="play" />玩游戏<br />
</body>
</html>
2、测试结果
