今天遇到一个在页面上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