jQuery全選、全不選、逆選
18868 ワード
1 <!DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8">
5 <script src="../js/jquery1.8.3.min.js"></script>
6 <title> -checkbox</title>
7 <style>
8 *{margin:10px}
9 </style>
10 </head>
11 <body>
12 <form method="post" action="">
13 ?
14 <br/>
15 <input type="checkbox" name="items" value=" " id="zq"/><label for="zq"> </label>
16 <input type="checkbox" name="items" value=" " id="lq"/><label for="lq"> </label>
17 <input type="checkbox" name="items" value=" " id="ymq"/><label for="ymq"> </label>
18 <input type="checkbox" name="items" value=" " id="ppq"/><label for="ppq"> </label>
19 <br/>
20 <input type="button" id="CheckedAll" value=" "/>
21 <input type="button" id="CheckedNo" value=" "/>
22 <input type="button" id="CheckedRev" value=" "/>
23
24 <input type="button" id="send" value=" "/>
25 </form>
26 <script>
27 $(function(){
28 //
29 $("#CheckedAll").click(function(){
30 $("input[name=items]").attr("checked",true);
31 });
32 //
33 $("#CheckedNo").click(function(){
34 $("input[name=items]").attr("checked",false);
35 });
36
37 //
38 $("#CheckedRev").click(function(){
39 //checkbox
40 var checkElem = $("input[name=items]");
41 /** :
42 for(var i = 0; i<checkElem.length;i++){
43 checkElem[i].checked = !checkElem[i].checked;
44 }
45 **/
46 // :
47 checkElem.each(function(){
48 this.checked = !this.checked;
49 });
50 /** :
51 checkElem.each(function(){
52 if($(this).attr("checked")){
53 $(this).attr("checked",false);
54 }else{
55 $(this).attr("checked",true);
56 }
57 });
58 **/
59 });
60 })
61 </script>
62 </body>
63 </html>