1、全选框被点击时，所以子选框被选中。

    2、当全选状态下，子选框的其中一个撤销点击，全选框自动unchecked

    3、为全选状态下，子选框一个个全部选中，最后一个子选框框点击之后，全选框自动checked

var information=$("#"+flag).find(".information");   var $newsCheck = information.find("input[name='newsCheck']");  //多选框全选与全不选  $(".all").click(function(){            if(this.checked){              $(this).parents().parents().siblings(".lists").find("input[name='newsCheck']").each(function(){this.checked=true;});          }else{              $(this).parents().parents().siblings(".lists").find("input[name='newsCheck']").each(function(){this.checked=false;});          }      }  );  //子选框反选  $("input[name='newsCheck']").click(function() {      var temp=document.getElementsByClassName("all");      for(var i=0;i<temp.length;i++){         if(temp[i].id == flag+"All"){             temp[i].checked=($newsCheck.length ==information.find("input[name='newsCheck']:checked").length ? true : false);         }      }  });

<div id="informContent">      <div class="informTitle title-blue">新闻动态</div>      <div class="information">          <div class="informMenu">              <div class="allcheck"><input type="checkbox"  class="all" id="informContentAll"><span>全选</span></div>              <div class="threeButton"><img src="images/content/chakan.png"><img src="images/content/xiugai.png"><img src="images/content/shanchu.png"></div>              <div class="addButton" id="newsPB"><img src="images/content/news.png"></div>          </div>            <div class="lists">           <div class="informList">                  <div class="newsTitle"><input type="checkbox" name="newsCheck">&nbsp;&nbsp;Facebook叫阵苹果HomeKit 推物联网云平台<img src="images/content/hebing.png" class="more"><span class="newsTime">2015-2-10</span></div>                  <div class="newsTitle"><input type="checkbox" name="newsCheck">&nbsp;&nbsp;Facebook叫阵苹果HomeKit 推物联网云平台<img src="images/content/hebing.png" class="more"><span class="newsTime">2015-2-10</span></div>          <div class="newsTitle"><input type="checkbox" name="newsCheck">&nbsp;&nbsp;Facebook叫阵苹果HomeKit 推物联网云平台<img src="images/content/hebing.png" class="more"><span class="newsTime">2015-2-10</span></div>                        </div>      </div>  </div>  <div id="activityContent">      <div class="informTitle title-red">活动动态</div>      <div class="information">          <div class="informMenu">              <div class="allcheck"><input type="checkbox"  class="all" id="activityContentAll"><span>全选</span></div>              <div class="threeButton"><img src="images/content/chakan.png"><img src="images/content/xiugai.png"><img src="images/content/shanchu.png"></div>              <div class="addButton"  id="activityPB"><img src="images/content/tianjia.png"></div>          </div>            <div class="lists">              <div class="informList">                       <div class="newsTitle"><input type="checkbox" name="newsCheck">&nbsp;&nbsp;Facebook叫阵苹果HomeKit 推物联网云平台<img src="images/content/hebing.png" class="more"><span class="newsTime">2015-2-10</span></div>                       <div class="newsTitle"><input type="checkbox" name="newsCheck">&nbsp;&nbsp;Facebook叫阵苹果HomeKit 推物联网云平台<img src="images/content/hebing.png" class="more"><span class="newsTime">2015-2-10</span></div>                       <div class="newsTitle"><input type="checkbox" name="newsCheck">&nbsp;&nbsp;Facebook叫阵苹果HomeKit 推物联网云平台<img src="images/content/hebing.png" class="more"><span class="newsTime">2015-2-10</span></div>                   </div>          </div>      </div>  </div>

这里我要做一些解释，我在一个页面中涉及了两组多选框，而两组复选框的相关class名称我全都命名为一样，算是想做一个通用的复选样式吧。

$(".all")表示两组复选框的全选checkbox,而两组的子选框name都为newsCheck。变量flag information是用于区分两组多选框的变量。flag有两种值：”informContent“ 和 ”activityContent“，至于具体值怎么转换就要看每个人的项目了。