亚洲国产日韩欧美一区二区三区,精品亚洲国产成人av在线,国产99视频精品免视看7,99国产精品久久久久久久成人热,欧美日韩亚洲国产综合乱

js控制div全選框

原創(chuàng) 2018-12-03 19:43:33 237
摘要:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>js-全選</title> <style type="text/css"> .box{ width: 120px; height: 25

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>js-全選</title>

<style type="text/css">

.box{

width: 120px;

height: 250px;

border: 1px solid  black;

border-radius: 5px;

padding: 5px 10px;

margin: 20px auto;

}

.box div{

border-bottom: 1px solid  black;/*下邊框線*/

padding-bottom: 10px;

margin-bottom: 8px;

}

.box input{

margin: 8px;

}

</style>

<script type="text/javascript">

function checkall () {

//聲明2個變量

var cheakall,item;

cheakall=document.getElementById("checkall");//獲取全選

item=document.getElementsByName("item[]");//獲取下面的勾選框

for (var i=0;i<=item.length;i++) {//i小于勾選框的長度

if (cheakall.checked) {//如果多選框都選中的情況下(checked:選中屬性)

item[i].checked=true;//全選被選中時,勾選框被選中

}else {

item[i].checked=false;//全選被選中時,勾選框被清空

}

}

}

</script>

</head>

<body>

<div class="box">

<div>

<input type="checkbox" id="checkall" onclick="checkall()"/><label for="checkall">全選</label>

</div>

<input type="checkbox" name="item[]"/>選項1<br />

<input type="checkbox" name="item[]"/>選項2<br />

<input type="checkbox" name="item[]"/>選項3<br />

<input type="checkbox" name="item[]"/>選項4<br />

<input type="checkbox" name="item[]"/>選項5<br />

<input type="checkbox" name="item[]"/>選項6<br />

</div>

</body>

</html>

總結:這個項目使用了遍歷以及數(shù)組的做法,但是無法理解為什么沒有聲明數(shù)組,而是直接使用item[]這個寫法。

批改老師:天蓬老師批改時間:2018-12-04 09:07:59
老師總結:完成的非常棒, 完全是我喜歡的風格, 復選框的name屬性這樣命名非常的規(guī)范

發(fā)布手記

熱門詞條