<!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"></script> <script> function clc(){ //alert验证代码块是否执行 alert($("#all").is(':checked')) //根据all的选中状态切换全体状态 if($("#all").is(":checked")){ $("input[type = 'checkbox']").attr("checked",true) }else{ $("input[type = 'checkbox']").attr("checked",false) } } </script> </head> <body> <input type="checkbox" id="all" onclick="clc()"/><br/> <input type="checkbox"/> <input type="checkbox"/> <input type="checkbox"/> <input type="checkbox"/> <input type="checkbox"/> </body> </html>
<!DOCTYPE html> <html> <head> <script src="/jquery/jquery-1.11.1.min.js"></script> <script> function clc(){ //alert验证代码块是否执行 alert($("#all").is(':checked')) //根据all的选中状态切换全体状态 if($("#all").is(":checked")){ $("input[type = 'checkbox']").attr("checked",true) }else{ $("input[type = 'checkbox']").attr("checked",false) } } </script> </head> <body> <input type="checkbox" id="all" onclick="clc()"/><br/> <input type="checkbox"/> <input type="checkbox"/> <input type="checkbox"/> <input type="checkbox"/> <input type="checkbox"/> </body> </html>
通过ID为all的选中状态,控制所有的checkbox选中。
在初次切换时,全选和全消有效。
但是第二次点击选中和取消就不会有选中状态的切换了,只有alert能表明确实进入代码块执行了。
function clc(){ //alert验证代码块是否执行 alert($("#all").is(':checked')) //根据all的选中状态切换全体状态 if($("#all").is(":checked")){ $("input[type = 'checkbox']").prop("checked",true) }else{ $("input[type = 'checkbox']").prop("checked",false) }}
js方法中attr方法更换为prop就可以了
非常谢谢,问题解决了。
用 .prop() 方法来代替:
$("input[type = 'checkbox']").prop("checked", true)
谢谢,问题解决了