摘要:<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>JavaScrip-—t全選-作業(yè)</title> <style type="text/css"> table{width:150px;height:120p
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScrip-—t全選-作業(yè)</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;//獲取個(gè)數(shù)
var all_res = all.checked;//獲取全選的狀態(tài)
var i = 0;//定義初始值
//i<個(gè)數(shù)的時(shí)候進(jìn)入循環(huán)
while(i <= item_count){
//判斷全選的狀態(tài),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>編號(hào)</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>
批改老師:查無此人批改時(shí)間:2019-01-14 16:18:03
老師總結(jié):完成的不錯(cuò)。養(yǎng)成好習(xí)慣,把代碼縮進(jìn),加點(diǎn)注釋。加油。