<html> <head> <meta charset="utf-8" /> <script type="text/javascript" src="jquery-1.7.1.min.js"></script> <script> $(document).ready(function(){ $("[name='allSel']").click(function(){ if($(this).is(':checked')){ $("[name='select']").attr('checked',true); }else{ $("[name='select']").attr('checked',false); } }) $("[name='select']").click(function(){ var allSel = false; $("[name='select']").each(function(){ if(!$(this).is(':checked')){ allSel = true; } }) if(allSel){ $("[name='allSel']").attr('checked',false); }else{ $("[name='allSel']").attr('checked',true); } }) }); </script> </head> <body> <input type="checkbox" name="allSel" />全选 <hr /> <input type="checkbox" name="select" value="1"/>1</br> <input type="checkbox" name="select" value="2"/>2</br> <input type="checkbox" name="select" value="3"/>3</br> <input type="checkbox" name="select" value="4"/>4</br> <input type="checkbox" name="select" value="5"/>5</br> </body> </html>
实际运用中出现一个BUG，
function check(id,check) {
if (check) {
$("." + id).find("input[type='checkbox']").attr("checked", true);
} else {
$("." + id).find("input[type='checkbox']").attr("checked", false);
}
}
第一遍勾选和取消是有效的，但是第二遍以后就没反应了，查看了属性，发现checked属性一直存在，但是没显示勾。就考虑移除checked属性看看。
function check(id,check) {
if (check) {
$("." + id).find("input[type='checkbox']").attr("checked", true);
} else {
$("." + id).find("input[type='checkbox']").removeAttr("checked");
}
}
这次看到checked属性勾上有了，取消就没了，可是问题还是没解决，还是第二遍以后就没反应了。看Jquery手册上说1.6以下版本在IE6使用JQuery的removeAttr方法删除disabled是无效的。解决的方法就是使用$("XX").prop("disabled",false);课时我都用1.10的版本了，不管那么多了，死马当活马医就用这个方法试试。
function check(id,check) {
if (check) {
$("." + id).find("input[type='checkbox']").prop("checked", true);
} else {
$("." + id).find("input[type='checkbox']").removeAttr("checked");
}
}
写成这样，问题解决