使用jQuery实现复选框全选和取消全选

<html>
  <head>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript">
      $("#check_all").live("click",function(event){
        if($("#check_all").hasClass('not_checked')){
          $("#check_all").removeClass('not_checked');
          $(".check-box").attr('checked',true);
        } else {
          $("#check_all").addClass('not_checked');
          $(".check-box").attr('checked',false);
        }
      });
    </script>
  </head>
  <body>
    <table>
      <tr>
        <td>Select/Deselect</td>
        <td>
          <input type="checkbox" class="check-box not_checked" id="check_all"/>
        </td>
      </tr>
      <tr>
        <td>First</td>
        <td>
          <input type="checkbox" class="check-box" id="check_box2"/>
        </td>
      </tr>
      <tr>
        <td>Second</td>
        <td>
          <input type="checkbox" class="check-box" id="check_box3"/>
        </td>
      </tr>
      <tr>
        <td>Third</td>
        <td>
          <input type="checkbox" class="check-box" id="check_box4"/>
        </td>
      </tr>
    </table>
  </body>
</html>

 

你可能感兴趣的:(JavaScript,html,jquery,Ajax)