????：暫時還沒能有什么總結(jié)與理解，跟著老師做出了效果<!DOCTYPE html><html><head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge"><title>
暫時還沒能有什么總結(jié)與理解，跟著老師做出了效果
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style >
.boxs{
width: 90px;
height: 230px;
/* background-color: blueviolet; */
border:1px solid #999;
border-radius:5px;
padding: 5px 10px;
margin: 10px auto;
}
.boxs input{
margin: 5px 5px;
}
.boxs div{
border-bottom: 1px solid #999;
padding: 5px 0px;
margin-bottom: 5px;
}
</style>
<script type="text/javascript">
function checkall(){
var checkall,item;
checkall = document.getElementById('checkall');
item = document.getElementsByName('item[]');
for(var i=0;i<=item.length;i++){
if(checkall.checked){
item[i].checked=true;
}else{
item[i].checked=false;
}
}
}
</script>
</head>
<body>
<div class="boxs">
<div>
<input type="checkbox" id="checkall" onclick="checkall()" ><label for="checkall">全選</label>
</div>
<input type="checkbox" name="item[]" id=""><label>選項(xiàng)一</label><br/>
<input type="checkbox" name="item[]" id=""><label>選項(xiàng)二</label><br/>
<input type="checkbox" name="item[]" id=""><label>選項(xiàng)三</label><br/>
<input type="checkbox" name="item[]" id=""><label>選項(xiàng)四</label><br/>
<input type="checkbox" name="item[]" id=""><label>選項(xiàng)六</label><br/>
<input type="checkbox" name="item[]" id=""><label>選項(xiàng)五</label><br/>
<input type="checkbox" name="item[]" id=""><label>選項(xiàng)七</label><br/>
<input type="checkbox" name="item[]" id=""><label>選項(xiàng)八</label>
</div>
</body>
</html>
?? ???：天蓬老師?? ??：2019-01-27 09:11:40
???? ??：全選 , 了解原理, 就好做了, 重點(diǎn)在于checkbox的name屬性上