首页 > 其他 > 详细

checkbox操作

时间:2015-03-26 14:45:10      阅读:150      评论:0      收藏:0      [点我收藏+]

 小小示例:自己备份顺便粘出来共享.

引入头部文件:<script src="../js/jQuery1.7.2.js"></script>

 HTML代码:

  1 <table>

 2         <tr>
 3             <td>
 4                 <input type="checkbox" name="checkall" class="checkall" /></td>
 5             <td>用户名</td>
 6             <td>密码</td>
 7             <td>性别</td>
 8         </tr>
 9         <tr>
10             <td>
11                 <input type="checkbox" name="checkitem" class="checkitem" />
12             </td>
13             <td>张三</td>
14             <td>123</td>
15             <td>男</td>
16         </tr>
17         <tr>
18             <td>
19                 <input type="checkbox" name="checkitem" class="checkitem" />
20             </td>
21             <td>李四</td>
22             <td>123</td>
23             <td>男</td>
24         </tr>
25         <tr>
26             <td>
27                 <input type="checkbox" name="checkitem" class="checkitem" />
28             </td>
29             <td>阿朱</td>
30             <td>123</td>
31             <td>女</td>
32         </tr>
33     </table>

 

 Js代码:

 1 <script>
 2     $(function () {
 3         $(input[name="checkall"]).click(function () {//全选和反选
 4             $(input[name="checkitem"]).prop("checked", $(this).prop("checked"));
 5         });
 6         $(input[name="checkitem"]).click(function () {
 7             var $chk_all = $(input[name="checkall"]);
 8             var flag = true;
 9             var chk_val = $(this).parents(table).find(input[name="checkitem"]);
10             for (var i = 0; i < chk_val.length; i++) {
11                 if (!chk_val.eq(i).prop("checked")) {
12                     flag = false;
13                 }
14             }
15             $chk_all.prop("checked", flag);
16         });
17     });
18 </script>

 


checkbox操作

原文:http://www.cnblogs.com/ITMichael/p/4368568.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!