`
jsntghf
  • 浏览: 2479922 次
  • 性别: Icon_minigender_1
  • 来自: 苏州
社区版块
存档分类
最新评论

使用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>

 

分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics