<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScrip-—t全选-作业</title>
<style type="text/css">
table{width:150px;height:120px;margin:20px auto;text-align:center;border-collapse:collapse;}
th,td{border:1px solid #ccc;width:75px;line-height:20px;}
</style>
<script type="text/javascript">
function checkAll(){
var all = document.getElementById('checkall');
var item = document.getElementsByName('item[]');//name的名称必须一致
var item_count = item.length;//获取个数
var all_res = all.checked;//获取全选的状态
var i = 0;//定义初始值
//i<个数的时候进入循环
while(i <= item_count){
//判断全选的状态,true的话全部多选框的checked的值也为true,反之为false;
if(all_res){
item[i].checked = true;
}else{
item[i].checked = false;
}
i++;
}
}
</script>
</head>
<body>
<table>
<tr><th><input type = 'checkbox' id = 'checkall' onclick = 'checkAll()'>全选</th><th>编号</th></tr>
<tr><td><input type = 'checkbox' name='item[]' ></td><td>1</td></tr>
<tr><td><input type = 'checkbox' name='item[]' ></td><td>2</td></tr>
<tr><td><input type = 'checkbox' name='item[]' ></td><td>3</td></tr>
<tr><td><input type = 'checkbox' name='item[]' ></td><td>4</td></tr>
<tr><td><input type = 'checkbox' name='item[]' ></td><td>5</td></tr>
</table>
</body>
</html>