jQuery实现复选框 全选、反选、全不选 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
 <head>
  <title>复选框全选/全不选/反选</title>
  <script type="text/javascript" src="jquery-1.11.1.js"></script>
  <script type="text/javascript"> 
  /**
   * 全选
   * 
   * checkboxName 复选框的name
   */
   function allCkb(checkboxName){
     $('[name='+items+']:checkbox').each(function (){
    	 this.checked = true;
     });
  }
  /**
   * 全不选
   * 
   */
  function unAllCkb(){
     $('[type=checkbox]:checkbox').attr('checked', false);
  }
  /**
   * 反选
   * 
   * checkboxName 复选框的name
   */
  function inverseCkb(checkboxName){
     $('[name='+items+']:checkbox').each(function(){
     this.checked=!this.checked;
     });
  }
  </script>
 </head>
 
 <body>
	<input type="button" onclick="allCkb('hobby')" value="全　选"/>
	<input type="button" onclick="unAllCkb()" value="全不选"/>
	<input type="button" onclick="inverseCkb('hobby')" value="反　选"/><br/> 
	<input type='checkbox' name='hobby' value="0"/>踢足球<br/>
	<input type='checkbox' name='hobby' value="1"/>打网球<br/>
	<input type='checkbox' name='hobby' value="2"/>游泳<br/>
	<input type='checkbox' name='hobby' value="3"/>射击<br/><br/>
 </body>
</html>



posted @ 2015-01-17 22:32  刘彦民  阅读(233)  评论(0)  编辑  收藏  举报