JS的全选test
她的國2019-01-14 15:56:38250<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>quanxuan</title>
<style>
.box{
margin:0 auto;
width: 120px;
height: 250px;
background: #ccc;
border: 1px solid pink;
border-radius: 5px;
padding: 10px;
}
.box div{
border-bottom:1px solid black;
padding-bottom: 10px;
margin-bottom: 8px;
}
.box input{
margin: 10px;
}
</style>
<script>
function checkAll(){
let checkall,i;
checkall=document.getElementById("checkall");
i=document.getElementById("ie")
for(var n=0;n<i.length;n++){//id"ie"的长度做一个循环
if (checkall.checked) { //假设‘全选’被选择
i[n].checked=true;//
}else{
i[n].checked=false;
}
}
}
</script>
</head>
<body>
<div>
<div>
<input type="checkbox" id="checkall" onclick="checkAll()">全选
</div>
<input type="checkbox" id="ie">选项1 <br>
<input type="checkbox" id="ie">选项2 <br>
<input type="checkbox" id="ie">选项3 <br>
<input type="checkbox" id="ie">选项4 <br>
<input type="checkbox" id="ie">选项5
</div>
</body>
</html>