jquery checkbox选框操作

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
 2 <html>
 3   <head>
 4     <meta http-equiv="content-type" content="text/html; charset=UTF-8">
 5     <script type="text/javascript" src="../js/jquery-1.8.2.js"></script>
 6   </head>
 7   <body>
 8     <table border="1" align="center">
 9         <tr>
10             <th>状态</th>
11             <th>用户名</th>
12         </tr>
13         <tr>
14             <td><input type="checkbox"/></td>
15             <td>赵</td>
16         </tr>
17         <tr>
18             <td><input type="checkbox"/></td>
19             <td>钱</td>
20         </tr>        
21         <tr>
22             <td><input type="checkbox"/></td>
23             <td>孙</td>
24         </tr>    
25         <tr>
26             <td><input type="checkbox"/></td>
27             <td>李</td>
28         </tr>
29         <tr>
30             <td><input type="checkbox"/></td>
31             <td>周</td>
32         </tr>    
33         <tr>
34             <td><input type="button" value="全选中"/></td>
35             <td><input type="button" value="全取消"/></td>
36             <td><input type="button" value="全反选"/></td>
37         </tr>        
38     </table>
39     <script type="text/javascript">
40         //页面加载时，将全取消按钮失效
41         window.onload = function(){
42             $(":button:eq(1)").attr("disabled","disabled");
43         }
44         //全选中
45         $(":button:eq(0)").click(function(){
46             //所有复选框设置为选中状态
47             $(":checkbox").attr("checked","checked");
48             //将该按钮失效
49             $(this).attr("disabled","disabled");
50             //将全取消按钮生效
51             $(":button:eq(1)").removeAttr("disabled");
52         });
53         //全取消
54         $(":button:eq(1)").click(function(){
55             //所有选中的复选框删除选中属性
56             $(":checkbox:checked").removeAttr("checked");
57             //将该按钮失效
58             $(this).attr("disabled","disabled");
59             //将全选中按钮生效
60             $(":button:eq(0)").removeAttr("disabled");
61         });
62         //全反选
63         $(":button:eq(2)").click(function(){
64             
65             //将选中的失效
66             $(":checkbox:checked").attr("disabled","disabled");
67             
68             //将未选中的选中
69             $(":checkbox:not(:checked)").attr("checked","checked");
70             
71             //将失效的生效，同时删除选中属性
72             $(":checkbox:disabled").removeAttr("disabled").removeAttr("checked");            
73 
74         });
75     </script>
76   </body>
77 </html>

全反选或者

 1     $(":button:eq(2)").click(function(){
 2         $(":checkbox").each(function(){
 3             if($(this).attr("checked")!=null)
 4             {
 5                 $(this).removeAttr("checked");
 6             }
 7             else
 8             {
 9                 $(this).attr("checked","checked");
10             }
11         });
12         
13     });