首页 > 代码库 > jquery checkbox选框操作
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 });
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。