点滴积累【JS】---JS小功能(checkbox实现全选和全取消)

效果:

点滴积累【JS】---JS小功能(checkbox实现全选和全取消)点滴积累【JS】---JS小功能(checkbox实现全选和全取消)

代码:

 1 <head runat="server">

 2     <title></title>

 3     <script type="text/javascript">

 4         window.onload = function () {

 5             var ckall = document.getElementById('ck1');

 6             var ck = document.getElementsByName('name1');

 7             ckall.onclick = function () {

 8                 for (var i = 0; i < ck.length; i++) {

 9                     if (ckall.checked == true) {

10                         ck[i].checked = true;

11                     }

12                     else {

13                         ck[i].checked = false;

14                     }

15                 }

16             }

17         };

18     </script>

19 </head>

20 <body>

21     <form id="form1" runat="server">

22     <input type="checkbox" id="ck1" />

23     全选

24     <div id="div1">

25         <input type="checkbox" name="name1" />

26         <input type="checkbox" name="name1" />

27         <input type="checkbox" name="name1" />

28         <input type="checkbox" name="name1" />

29         <input type="checkbox" name="name1" />

30         <input type="checkbox" name="name1" />

31     </div>

32     </form>

33 </body>

 

你可能感兴趣的:(checkbox)