abstrakt:<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,&
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>JS全選-總結(jié)</title> <style> .box{width: 120px;height: 250px;border:1px solid #000;border-radius:5px;padding:0px 10px;margin:20px auto;} .box div{border-bottom:1px solid #ccc;padding-bottom:10px;margin-bottom:8px;} .box input{margin:8px;} </style> <script type="text/javascript"> //全選 checkall //選項(xiàng) checkbox function checkall(){ //以下是聲明兩個(gè)變量 var item,checkall; //以下是獲取全選的DOM元素ID名稱 checkall = document.getElementById('checkall'); //以下是獲取通過NAME獲得選項(xiàng)元素 item = document.getElementsByName('item[]'); //下面在然后做一個(gè)for循環(huán),var i = 0 初始化,i小于item選項(xiàng)的長度,i++點(diǎn)擊的次數(shù)不可大于item選項(xiàng) for (var i=0;i<item.length;i++) { //checked 是選中的意思,判斷當(dāng)item為真就checked if (checkall.checked) { item[i].checked = true; //else 如果以上判斷不符合條件執(zhí)行執(zhí)行else中的語句 }else{ //如果checked為假就不checked item[i].checked = false; } } } </script> </head> <body> <div> <div> <input type="checkbox" id="checkall" onclick="checkall()"><label for="checkall">全選</label> </div> <input type="checkbox" name="item[]">選項(xiàng)1<br> <input type="checkbox" name="item[]">選項(xiàng)2<br> <input type="checkbox" name="item[]">選項(xiàng)3<br> <input type="checkbox" name="item[]">選項(xiàng)4<br> <input type="checkbox" name="item[]">選項(xiàng)5<br> <input type="checkbox" name="item[]">選項(xiàng)6<br> </div> </body> </html>
Korrigierender Lehrer:滅絕師太Korrekturzeit:2018-11-26 09:23:59
Zusammenfassung des Lehrers:嗯,這樣寫對學(xué)習(xí)有好處,思路清晰!繼續(xù)保持!