用js实现全选功能
1 <!DOCTYPE html>
2 <html lang="en">
3 <head>
4 <meta charset="UTF-8">
5 <title>全选</title>
6 </head>
7 <body>
8 全选
9 <input type="checkbox" id="father" onclick="checkFather()"><br>
10 <input type="checkbox" name="son" onclick="checkSon()"><br>
11 <input type="checkbox" name="son" onclick="checkSon()"><br>
12 <input type="checkbox" name="son" onclick="checkSon()"><br>
13 <input type="checkbox" name="son" onclick="checkSon()"><br>
14 </body>
15 </html>
16 <script>
17 function checkFather() {
18 var father = document.getElementById("father");
19 var sons = document.getElementsByName("son");
20 for (var i = 0; i < sons.length; i++) {
21 sons[i].checked = father.checked;
22 }
23 }
24
25 function checkSon() {
26 var father = document.getElementById("father");
27 var sons = document.getElementsByName("son");
28 var flag = true;
29 for (var i = 0; i < sons.length; i++) {
30 if (sons[i].checked == false) {
31 flag = false;
32 break;
33 }
34 }
35 father.checked = flag;
36 }
37 </script>
来源:https://www.cnblogs.com/daiwenxiang/p/12176183.html