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

时间：2021-03-02 19:29:35
<!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>

相关文章