比較實用的復選框的實用javascript腳本

2019-11-21 01:56:16

字體：大中小

來源：轉載

供稿：網友

在很多網站里這都是一個很常見的效果，就是點擊總分類的復選框，自動選擇所有子分類的復選框，或者如果子分類的所有復選框全部被選中則總分類復選框也自動被選中。
這次偶時再msn的網站上偶然看到的，于是自己也試著寫了下。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head>   <title></title>   <script type="text/javascript">     function checkAll(str){         var a=document.getElementById("t"+str).getElementsByTagName("input");         var b=document.getElementById("d"+str);         for(var i=0;i<a.length;i++){             a[i].checked=b.checked;         }     }     function fixChk(str){         var a=document.getElementById("t1").getElementsByTagName("input");         var b=document.getElementById("d1");         for(var i=0;i<a.length;i++){             if(a[i].checked==false){                 b.checked=false;                 return ;             }         }         b.checked=true;     }   </script> </head> <body> <center> <div style="width:90%;text-align:left;border:1px solid #ccc;height:25px;line-height:25px"><input type="checkbox" id="d1" onclick="checkAll('1')"/>休閑娛樂</div> <div style="width:90%;text-align:left;border:1px solid #ccc;" id="t1">   <input type="checkbox" onclick="fixChk('1')" />書籍及雜志   <input type="checkbox" onclick="fixChk('1')" />音樂及影碟   <input type="checkbox" onclick="fixChk('1')" />旅游 </div> </center> </body> </html>

[Ctrl+A 全選注:如需引入外部Js需刷新才能執行]

上一篇：js下獲得單選框的值的代碼

下一篇：用javascript實現畫板的代碼