表单的小例子吖

Posted 悔创阿里-杰克马

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了表单的小例子吖相关的知识,希望对你有一定的参考价值。

 1  1 <!DOCTYPE html>
 2  2 <html>
 3  3     <head>
 4  4         <meta charset="UTF-8">
 5  5         <title></title>
 6  6     </head>
 7  7     <body>
 8  8         <form action="" method="post">
 9  9         你喜欢什么运动?<input type="checkbox" id="btn" value=""/> 全选/全不选<br />
10 10         <input type="checkbox" name="item" id="" value="" />篮球
11 11         <input type="checkbox" name="item" id="" value="" />足球
12 12         <input type="checkbox" name="item" id="" value="" />羽毛球
13 13         <input type="checkbox" name="item" id="" value="" />排球
14 14         </form>
15 15         <br />
16 16         <input type="button" id="btn1" value="全选"/>
17 17         <input type="button" id="btn2" value="全不选"/>
18 18         <input type="button" id="btn3" value="反选"/>
19 19         <input type="button" id="btn4" value="提交"/>
20 20         <script type="text/javascript">
21 21             window.onload = function(){
22 22                 var btnall = document.getElementById("btn1");
23 23                 var btnno = document.getElementById("btn2");
24 24                 var btnrev = document.getElementById("btn3");
25 25                 var btnsub = document.getElementById("btn4");
26 26                 var btn = document.getElementById("btn");
27 27                 var items =document.getElementsByName("item");
28 28                 var len = items.length;
29 29                 for(let i = 0; i<len ; i++){
30 30                     items[i].onclick=()=>{
31 31                         btn.checked = true;
32 32                         for(let i=0; i<len ; i++){
33 33                             if(!items[i].checked){
34 34                                 btn.checked=false;
35 35                             }
36 36                         }
37 37                     }
38 38                 }
39 39                     btn.onclick=()=>{
40 40                         for(let i = 0;i<len;i++){
41 41                     items[i].checked=btn.checked;
42 42                         }
43 43                     }
44 44                     btnall.onclick =()=>{
45 45                     for(let i = 0; i< len ; i++){
46 46                     items[i].checked = true;
47 47                     btn.checked=items[i].checked;
48 48                     }
49 49                 }
50 50                     btnno.onclick =()=>{
51 51                     for(let i = 0; i< len ; i++){
52 52                     items[i].checked = false;
53 53                     btn.checked=items[i].checked;
54 54                     }
55 55                 }
56 56                     btnrev.onclick =()=>{
57 57                     for(let i = 0; i< len ; i++){
58 58                         items[i].checked = !items[i].checked;
59 59                             for(let i = 0;i<len;i++){
60 60                             btn.checked=true;
61 61                             for(let i = 0; i<len ; i++){
62 62                                 if(!items[i].checked){
63 63                                     btn.checked=items[i].checked;
64 64                                 }
65 65                             }
66 66                         }
67 67                     }
68 68                 }
69 69                     btnsub.onclick =()=>{
70 70                     for(let i = 0; i< len ; i++){
71 71                             if(items[i].checked){
72 72                             alert(items[i].nextSibling.nodeValue);
73 73                             }
74 74                         }
75 75                     }    
76 76                 }
77 77         </script>
78 78     </body>
79 79 </html>

 

以上是关于表单的小例子吖的主要内容,如果未能解决你的问题,请参考以下文章

golang goroutine例子[golang并发代码片段]

分享几个实用的代码片段(附代码例子)

分享几个实用的代码片段(附代码例子)

如何使用多个 JSF 表单

微信小程序代码片段

Python生日蛋糕