<p>第一种:纯原生版</p><pre class="brush:html;toolbar:false"><!DOCTYPEhtml>
<html>
<head>
<metacharset="UTF-8">
<title></title>
</head>
<body>
<div>
<ul>
<li>
<label><inputtype="checkbox"name="wp"value="wpa"/>液体</label>
</li>
<li>
<label><inputtype="checkbox"name="wp"value="wpb"/>粉末</label>
</li>
<li>
<label><inputtype="checkbox"name="wp"value="wpc"/>仿牌</label>
</li>
<li>
<label><inputtype="checkbox"name="wp"value="wpd"/>纯电池</label>
</li>
<li>
<label><inputtype="checkbox"name="wp"value="wpe"/>危险品</label>
</li>
<li>
<label><inputtype="checkbox"name="wp"value="wpd"/>配套电池</label>
</li>
<li>
<label><inputname="allChecked"id="allChecked"onclick="DoCheck()"type="button"value="全选/取消"/></label>
</li>
</ul>
</div>
<scripttype="text/javascript">
functionDoCheck(){
varch=document.getElementsByName("wp");
if(document.getElementsByName("allChecked")[0].checked==true){
for(vari=0;i<ch.length;i++){
ch[i].checked=true;
}
}else{
for(vari=0;i<ch.length;i++){
ch[i].checked=false;
}
}
}
</script>
</body>
</html></pre><p>第二种:jQuery版</p><pre class="brush:html;toolbar:false"><!DOCTYPEHtml>
<html>
<head>
<metacharset="UTF-8">
<title>全选/全取消</title>
</head>
<body>
<div>
新闻<inputtype="checkbox"/><br/>
电影<inputtype="checkbox"/><br/>
音乐<inputtype="checkbox"/><br/>
娱乐<inputtype="checkbox"/><br/>
八卦<inputtype="checkbox"/><br/>
直播<inputtype="checkbox"/><br/>
</div>
<inputtype="checkbox"onclick="selectAll(this);"/>全选/全取消<br/>
<scriptsrc="js/jquery-1.11.3.js"></script>
<scripttype="text/javascript">
functionselectAll(checkbox){
$('input[type=checkbox]').prop('checked',$(checkbox).prop('checked'));
}
</script>
</body>
</html></pre>