abstract:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>js全选</title><style type="text/css">*{padding: 0;margin: 0;}.box{width: 100px;borde
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>js全选</title>
<style type="text/css">
*{padding: 0;
margin: 0;
}
.box{
width: 100px;
border:1px solid #ccc;
border-radius: 4px;
margin:50px auto;
padding:10px;
}
.check{
height: 32px;
line-height: 32px;
border-bottom: 1px solid #ccc
}
input{
margin:10px 0;
}
</style>
</head>
<body>
<div>
<div >
<input type="checkbox" id="checkall" onclick="checkall()"><label for="checkall">全选</label>
</div>
<input type="checkbox" name="item[]">菜单1</input><br>
<input type="checkbox" name="item[]">菜单2</input><br>
<input type="checkbox" name="item[]">菜单3</input><br>
<input type="checkbox" name="item[]">菜单4</input><br>
<input type="checkbox" name="item[]">菜单5</input><br>
<input type="checkbox" name="item[]">菜单6</input> <br>
</div>
<script type="text/javascript">
function checkall(){
var ck,item;
ck =window.document.getElementById('checkall');
item = window.document.getElementsByName('item[]');
for (var i =0; i < item.length ; i++) {
if(ck.checked){
item[i].checked = true;
}else{
item[i].checked = false;
}
}
}
</script>
</body>
</html>
Correcting teacher:天蓬老师Correction time:2019-03-19 15:50:05
Teacher's summary:这是复制的教学代码吧, 想一下这个全选功能会用在哪, 自己写一下试试看