简简单单两行代码搞定checkbox全选和取消全选
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>全选测试</title> <script type=text/javascript src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script> </head> <body> <input type="checkbox" id="quanxuan" />全选<br /> <input type="checkbox" class="qx" />aa<br /> <input type="checkbox" class="qx" />aa<br /> <input type="checkbox" class="qx" />aa<br /> <input type="checkbox" class="qx" />aa<br /> <input type="checkbox" class="qx" />aa<br /> </body> </html> <script type="text/javascript"> $("#quanxuan").click(function(){ var xz = $(this).prop("checked");// 判断全选按钮的选中状态 var ck = $(".qx").prop("checked",xz); // 让class名为qx的选项的选中状态和全选按钮的选中状态一致。 }); </script>
<sc ript type=text/ja vasc ript src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></sc ript> </head> <body> <input type="checkbox" id="quanxuan" />全选<br /> <input type="checkbox" class="qx" />aa<br /> <input type="checkbox" class="qx" />aa<br /> <input type="checkbox" class="qx" />aa<br /> <input type="checkbox" class="qx" />aa<br /> <input type="checkbox" class="qx" />aa<br /> </body> </html> <script type="text/javascript"> $("#quanxuan").click(function(){ var xz = $(this).prop("checked");/ /判断全选按钮的选中状态 var ck = $(".qx").prop("checked",xz); // 让class名为qx的选项的选中状态和全选按钮的选中状态一致。 }); </script> $("#quanxuan").click(function(){ var xz = $(this).prop("checked");// 判断全选按钮的选中状态 var ck = $(".qx").prop("checked",xz); // 让class名为qx的选项的选中状态和全选按钮的选中状态一致。 }); </script>