jQuery写的页面checkbox全选,全不选代码

今天遇到一个在页面上checkbox全选全不选的功能

效果图

全选的id是:Checkbox2

下面是js代码:

 1   <script type="text/javascript" language="javascript">
 2 
 3       var allCheckName = "Checkbox2"; //全选的id
 4       $(document).ready(function() {
 5           var item = $(":checkbox");
 6           if (item) {
 7               $(item).each(function(index) {
 8 
 9                   $(this).click(function() {
10                       if ($(this)[0].id == allCheckName) {
11                           all($(this));
12                       }
13                       if ($(this)[0].id != allCheckName && $(this)[0].checked == false) {
14                           $("#" + allCheckName)[0].checked = false;
15                       }
16                       if ($(this)[0].id != allCheckName && $(this)[0].checked == true) {
17 
18                           if (getAllCheck()) {
19                               $("#" + allCheckName)[0].checked = true;
20                           }
21                       }
22                   });
23 
24               });
25           }
26 
27           function getAllCheck() {
28               var num = 0;
29               $(item).each(function(ind) {
30                   if ($(this)[0].id != "Checkbox2" && $(this)[0].checked) {
31                       num++;
32                   }
33               });
34               if (num == (item.length - 1)) {
35                   return true;
36               }
37 
38               return false;
39           }
40           function all(obj) {
41               $(item).each(function(ind) {
42                   $(this)[0].checked = obj[0].checked;
43               });
44           }
45 
46 
47       });
48          
49     </script>

主要功能是全选,全不选,一个不选全选不选中,其他选择全选选中

本文出自 “net路途中” 博客，请务必保留此出处http://xqaizx.blog.51cto.com/1064363/976543

posted on 2012-08-30 09:10 守护者阅读(256) 评论(0) 编辑收藏举报