<!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中人名识别分析详解 在看源码之前,先看几遍论文<基于角色标注的中国人名自动识别研究> 关于命名识别的一些问题,可参考下列一些issue: l ·名字识别的问题 #387 l ·机 ...

  2. RedHat6.5如何被windows系统远程桌面连接

    一.redhat 6.5远程桌面配置 服务器端: 1.设置允许其它人查看您的远程桌面 在“系统”-“首选项”-“远程桌面”-在“允许其它人查看您的远程桌面”前打勾:在“允许其它用户控制您的桌面”打勾 ...

  3. Feign 请求拦截器和日志

    Feign 支持请求拦截器,在发送请求前,可以对发送的模板进行操作,例如设置请求头等属性,自定请求拦截器需要实现 feign.RequestInterceptor 接口,该接口的方法 apply 有参 ...

  4. 代理本地局域网其他PC上网的设置

  5. NAND FLASH控制器

    一.nand flash访问原理 地址空间概念 nand的编址 nand命令  命令,地址,数据 使用S3C2440的nand flash控制器访问nand flash 前几个编译出来的文件都小于4k ...

  6. GetPostBackEventReference加RaisePostBackEvent实现自定义控件中回调传参

    ; //回调函数,回调参数值:eventArgument        public void RaisePostBackEvent(string eventArgument)        {    ...

  7. 【mysql】索引优化记录

    基础知识 Innodb存储引擎 支持行锁 支持事务: Myisam存储引擎 只支持表锁: 不支持事务: 常见索引列表 独立的列 前缀索引(索引选择性) 多列索引(并不是多个单列索引,索引顺序很重要) ...

  8. 【剑指offer】二进制中1的个数

    输入一个整数,输出该数二进制表示中1的个数.其中负数用补码表示. 思路:将原数字与1按位进行与操作. public class Solution { public int NumberOf1(int ...

  9. uoj #58【WC2013】糖果公园

    http://uoj.ac/problem/58 树上带修莫队模板题 #include<bits/stdc++.h> ; typedef long long i64; ],*ptr=buf ...

  10. jquery zTree搜索高亮的例子

    思路: 搜索的时候发请求到后台,后台根据关键字找到匹配的节点,并将这些节点添加一个标志light: 后面就根据这个light为true就高亮,false就不高亮: 后台将这些节点返回到前台,前台展示: ...