先引入jquery,下面是html代码
<!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8" /> <title>Document</title> </head> <body> <input id="test1"type="checkbox" >全选 <input type="checkbox" id="test2" name="tpState" value="249">249-工人已接受 <input type="checkbox" id="test3" name="tpState" value="240">240-工人已接受 <input type="checkbox" id="test4" name="tpState" value="248">248-工人已接受 <script src="js/jquery-1.8.2.min.js"></script> <script> $("#test2").on("click",function(){ if($("#test2").is(':checked')==true&&$("#test3").is(':checked')==true&&$("#test4").is(':checked')==true){ $("#test1").attr("checked",true); }else{ $("#test1").attr("checked",false); } }) $("#test3").on("click",function(){ if($("#test2").is(':checked')==true&&$("#test3").is(':checked')==true&&$("#test4").is(':checked')==true){ $("#test1").attr("checked",true); }else{ $("#test1").attr("checked",false); } }) $("#test4").on("click",function(){ if($("#test2").is(':checked')==true&&$("#test3").is(':checked')==true&&$("#test4").is(':checked')==true){ $("#test1").attr("checked",true); }else{ $("#test1").attr("checked",false); } }) $("#test1").on("click",function(){ if($("#test1").is(':checked')==true){ $("#test2").attr("checked",true); $("#test3").attr("checked",true); $("#test4").attr("checked",true); }else{ $("#test2").attr("checked",false); $("#test3").attr("checked",false); $("#test4").attr("checked",false); } }) </script> </body> </html>