利用鼠标的onclick事件,实现简单的全选功能
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>onclick鼠标点击事件</title>
<script>
window.onload = function() {
/*第一种方式,和id关联
var cb = document.getElementById("cb");
cb.onclick = function() {
alert("点击checkbox");
}
*/
/*
document.onclick = function() {
//窗体点击事件
alert("点击窗体");
}
*/
}
function choose(thisa){
//alert("点击choose");
//alert(thisa.checked);
var cbox = document.getElementsByName("cbox");
//名字相同,自动生成一个数组
var len = cbox.length;
for(var i = 0; i < len; i++) {
cbox[i].checked = thisa.checked;
}
}
</script>
</head>
<body>
<table border="2">
<tr>
<td><input id="cb" type="checkbox" onClick="choose(this)" name="cbox">全选</td>
<td>选项内容</td>
</tr>
<tr>
<td><input id="cb" type="checkbox" name="cbox"></td>
<td>aaaaaaaaaa</td>
</tr>
<tr>
<td><input id="cb" type="checkbox" name="cbox"></td>
<td>aaaaaaaaaa</td>
</tr>
<tr>
<td><input id="cb" type="checkbox" name="cbox"></td>
<td>aaaaaaaaaa</td>
</tr>
<tr>
<td><input id="cb" type="checkbox" name="cbox"></td>
<td>aaaaaaaaaa</td>
</tr>
<tr>
<td><input id="cb" type="checkbox" name="cbox"></td>
<td>aaaaaaaaaa</td>
</tr>
</table>
</body>
</html>