首页 > 代码库 > jquery实现全选、全不选、反选操作

jquery实现全选、全不选、反选操作

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html> 3 <head> 4     <title>新建网页</title> 5     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 6     <meta name="description" content=""/> 7     <meta name="keywords" content=""/> 8     <script type="text/javascript" src="http://www.mamicode.com/jquery-1.4.4.js" ></script> 9 10     <script type="text/javascript">11         function selAll(){12             $(".ho").attr(‘checked‘,true);13         }14         function selAllNot(){15             $(".ho").attr(‘checked‘,false);16         }17         function selFan(){18             //反选操作19             //获得全部复选框、遍历、判断当前选中情况20             for(var i=0; i<$(".ho").length; i++){21                 var flag = $(".ho:eq("+i+")").attr("checked");22                 $(".ho:eq("+i+")").attr("checked",!flag);23             }24         }25     </script>26 </head>27 <body>28 <h2>复选框操作</h2>29 30 <input type="checkbox" name="hobby[]" id="hobbya" class="ho" value=http://www.mamicode.com/‘a‘>篮球31 <input type="checkbox" name="hobby[]" id="hobbyb" class="ho" value=http://www.mamicode.com/‘b‘>足球32 <input type="checkbox" name="hobby[]" id="hobbyc" class="ho" value=http://www.mamicode.com/‘c‘>登山33 <input type="checkbox" name="hobby[]" id="hobbyd" class="ho" value=http://www.mamicode.com/‘d‘>排球34 35 <br /><br />36 <input type="button" value="http://www.mamicode.com/全选" onclick="selAll()" />37 <input type="button" value="http://www.mamicode.com/全不选" onclick="selAllNot()" />38 <input type="button" value="http://www.mamicode.com/反选" onclick="selFan()" />39 </body>40 </body>41 </html>

 

jquery实现全选、全不选、反选操作