jquery实现全选全消反选功能

Posted 怪咖在骚动

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jquery实现全选全消反选功能相关的知识,希望对你有一定的参考价值。

html代码:  

  

<input type="checkbox" name="checkbox" class="A"  />

使用按钮来实现全选、全消、反选

<button  id="checkAll">全选</button  >
<button   id="removeAll">全消</button  >
<button   id="reverse">反选</button  >

  jquery代码要求:1.项目中必须引入jquery,2.必须在<script></script>之中写

      // 全选
      $("#checkAll").click(function() {
          $(".A").prop(‘checked‘,true);
      });
      // 全消
      $("#removeAll").click(function() {
          $(".A").prop(‘checked‘,false);
      });

      // 反选
      $("#reverse").click(function(){
          $(".A").each(function(){
              $(this).prop(‘checked‘,!$(this).prop(‘checked‘));
          })
      });

  

  

以上是关于jquery实现全选全消反选功能的主要内容,如果未能解决你的问题,请参考以下文章

Layui table中筛选列增加 [全选,反选] 功能【转】

Vue实现单选、全选和反选

js 脚本怎样实现checkbox的全选,反选,类似邮箱中邮件的全选后删除移动

jquery全选反选全不选代码

jQuery实现复选框全选全不选反选问题解析

JQuery案例二:实现全选全不选和反选