学斋随笔,初九潜龙勿用,-13复选框


 1 // JavaScript Document
 2 var oth = null;
 3 window.onload= function(){
 4     oth=document.getElementsByClassName("all");
 5     for(var j=0;j<oth.length;j++){
 6         oth[j].addEventListener("click",all);
 7     }
 8 }
 9 
10 /*下面是全选全不选*/
11  window.onload = function(){
12     var inputall = document.getElementById("all");
13     inputall.addEventListener("click",checkes);
14 }
15 function checkes(){
16     var obj = this;
17     var objs = document.getElementsByClassName("all");
18     for(var i = 0;i<objs.length;i++){
19         objs[i].checked = obj.checked;
20     }
21 }

 

 1  <!doctype html>
 2     <html>
 3         <head>
 4             <meta charset="utf-8">
 5             <title>复选框扩展</title>
 6         <script type="text/javascript" src="ks_fx.js"></script>
 7         </head>
 8 
 9     <body>
10     <table border="2" width="50%">
11             <tr>
12                 <th>
13                     <input type="checkbox" id="all">全选
14                 </th>
15                 <th>姓名</th>
16                 <th>性别</th>
17                 <th>年龄</th>
18             </tr>
19             <tr>
20                 <td>
21                     <input type="checkbox" class="all" onClick="qx()">
22                 </td>
23                 <td>张三</td>
24                 <td></td>
25                 <td>23</td>
26             </tr>
27             <tr>
28                 <td>
29                     <input type="checkbox" class="all" onClick="qx()">
30                 </td>
31                 <td>李四</td>
32                 <td></td>
33                 <td>25</td>
34             </tr>
35             <tr>
36                 <td>
37                     <input type="checkbox" class="all" onClick="qx()">
38                 </td>
39                 <td>王五</td>
40                 <td></td>
41                 <td>23</td>
42             </tr>
43         </table>
44     </body>
45     </html>

 

posted @ 2019-01-04 13:42  玩转手绘  阅读(108)  评论(0)    收藏  举报