<!DOCTYPE html>

<html>

  <head>

    <meta charset="utf-8">

    <title></title>

    <script src="/vue/js/jquery-3.3.1.js" type="text/javascript">  </script>

    <script type="text/javascript">

    $(function ()

    {

       //所有复选选中让 全选的复选框选中

      $("table tr td input[type='checkbox']").click(function(){

          var check= $("table tr td input[type='checkbox']:checked").length;

          var all=$("table tr td input[type='checkbox']").length;

          if(check==all)

          {

            $("#all").prop("checked",true)

          }

          else {

            $("#all").prop("checked",false)

          }

      })

        $("#all").click(function(){

          var c=  $("#all").prop("checked")

          if (c==true) {

            $("table tr td input[type='checkbox']").prop("checked",true)

          }

          else {

              $("table tr td input[type='checkbox']").prop("checked",false)

          }

        })

  //反选按钮

      $("#selectno").click(function(){

        //获取所有未选中行的checkbox长度

      var no=  $("table tr td input[type='checkbox']:not(:checked)").length

          //获取所有选中行的checkbox长度

      var yes= $("table tr td input[type='checkbox']:checked").length

            alert( '选中长度'+yes)

            alert('未选中长度'+no)

            $("table tr td input[type='checkbox']").each(function(){

            $(this).prop("checked",!$(this).prop("checked"))

            })

        })

    })

    </script>

  </head>

  <body>

    全选：<input type="checkbox" id="all" >

    <input type="button" id="selectno" value="反选" >

<table>

  <tr>

    <td>状态</td>   <td>姓名</td>   <td>工资</td>

  </tr>

  <tr>

    <td> <input type="checkbox" name="" value=""> </td>

    <td>张三</td>

    <td></td>

  </tr>

  <tr>

     <td> <input type="checkbox" name="" value=""> </td>

     <td>李四</td>

     <td></td>

  </tr>

  <tr>

     <td> <input type="checkbox" name="" value=""> </td>

     <td>王五</td>

     <td></td>

  </tr>

  <tr>

     <td> <input type="checkbox" name="" value=""> </td>

     <td>赵六</td>

     <td></td>

  </tr>

  <tr>

     <td> <input type="checkbox" name="" value=""> </td>

     <td>田七</td>

     <td></td>

  </tr>

  <tr>

     <td> <input type="checkbox" name="" value=""> </td>

     <td>王八</td>

     <td></td>

  </tr>

</table>

  </body>

</html>

Jquery，全选，反选，的更多相关文章

  1. jQuery全选/反选checkbox

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. 关于JQuery全选/反选第二次失效的问题

    最近在项目中,遇到一个问题,测试全选/反选功能时,第一次对母框进行选中/非选中时,能同步子框的全选/反选状态,之后再点击母框,子框就没反应了.原代码大致结构关键如下: function selectA ...

  3. jQuery全选反选插件

    (function($){ $.fn.check = function(options){ var options = $.extend({ element : "input[name='n ...

  4. jQuery全选反选实例

    1. $('#tb:checkbox').each(function(){ 每次都会执行 全选-取消操作,注意$('#tb :checkbox').prop('checked',true); tb后面 ...

  5. JQuery 全选 反选 获取Table 中指定td的元素值

    //全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th>& ...

  6. jquery全选 反选

    //全选 反选 $('#chkAll').on('click',function(){ $('input.chkbox').prop('checked',$(this).prop('checked') ...

  7. 关于jquery全选反选 批量删除的一点心得

    废话不多说直接上代码: 下面是jsp页面的html代码: <table id="contentTable" class=""> <thead& ...

  8. jquery全选反选

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. jQuery 全选 反选 单击行改变背景色

    我先把CSS样式放出来,其实这个可以直接忽略 ;;font-size:12px;font-family:微软雅黑;} .datagrid{width:100%;} .datagird tr th{ba ...

  10. jquery 全选反选 .prop('checked',!$(this).is(':checked'));

    //废话不说直接上代码 $("#").click(function(){ $("#content-div label input[type='checkbox']&quo ...

随机推荐

  1. Hanlp自然语言处理工具的使用演练

    Hanlp是由一系列模型与算法组成的工具包,目标是普及自然语言处理在生产环境中的应用.Hanlp具备功能完善.性能高效.架构清洗.语料时新.可自定义的特点:提供词法分析(中文分词.磁性标注.命名实体识 ...

  2. 查找Python项目依赖的库并生成requirements.txt

    使用pip freeze pip freeze > requirements.txt 这种方式配合virtualenv 才好使,否则把整个环境中的包都列出来了. 使用 pipreqs 这个工具的 ...

  3. Python标示符和关键字

    标示符 什么是标示符,看下图: 标识符就是开发人员在程序中自定义的一些符号和名称. 标示符是自己定义的,如变量名 .函数名等. 标示符的规则 标示符由字母.下划线和数字组成,且数字不能开头 pytho ...

  4. java中的自定义注解的使用

    https://www.cnblogs.com/acm-bingzi/p/javaAnnotation.html

  5. load() 方法

    jQuery ajax - load() 方法 $("button").click(function(){ $("div").load('demo_ajax_l ...

  6. bundle adjustment 玩具程序

    结合 bundle adjustment原理(1) 和 Levenberg-Marquardt 的 MATLAB 代码 两篇博客的成果,调用MATLAB R2016a中 bundleAdjustmen ...

  7. 廖雪峰Java5集合-3Map-Properties的使用

    Properties用于读取配置 properties文件只能使用ASCII码 #表示注释 可以从文件系统读取.properties文件 Properties props = new Properti ...

  8. URL优化的几个处理方法

    原文链接:http://www.51chinashop.com/shopinfo/dsjs/2014-11-23/100.html 在一个网站中,一个页面对应了多个URL,必然会分散这个页面的权重.因 ...

  9. Jmeter（二十四）Jmeter-Question之“加密请求参数”

    日常接口测试碰到参数加密的情况不在少数,当然与之相对的也有解密.直接记录实例: 排除各家用的不一样的加密方式,用的最多的还是MD5加密(16,32).Jmeter3.2版本已经有解决方案 1.${__ ...

  10. SCCM2012 R2实战系列之四：初始化配置

    在之前的文章中,我们已经完成了SCCM 2012 R2 独立主站点的部署.为了客户端代理软件的顺利安装和OSD操作系统的分发,我们需要配置组策略及DHCP服务.在本系列的第四部分,跟大家一起分享下如何 ...