<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <input type="button" value="全选" onclick="checkAll()"/>

    <input type="button" value="反选" onclick="notCheck()"/>

    <input type="button" value="取消" onclick="notCheckAll()"/>

    <table border="1">

        <thead>

            <tr>

                <th>选项</th>

                <th>ip</th>

                <th>端口</th>

            </tr>

        </thead>

        <tbody id="tb">

            <tr>

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

                <td>1.1.1.1</td>

                <td>20012</td>

            </tr>

            <tr>

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

                <td>1.1.1.1</td>

                <td>20012</td>

            </tr>

            <tr>

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

                <td>1.1.1.1</td>

                <td>20012</td>

            </tr>

            <tr>

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

                <td>1.1.1.1</td>

                <td>20012</td>

            </tr>

        </tbody>

    </table>

<script src="jquery.js"></script>

<script>

    function checkAll() {

        $('#tb :checkbox').prop('checked',true);

    }

    function notCheckAll(){

        $('#tb :checkbox').prop('checked',false);

    }

    function notCheck() {

        $('#tb :checkbox').each(function (k) {

//            this,指代的是当前循环的每个元素

//            使用dom方法

//            if(this.checked){

//                this.checked=false

//            }else{this.checked=true;}

//            使用jquery的第一种方式：

//            if($(this).prop('checked')){

//                $(this).prop('checked',false)

//            }else{$(this).prop('checked'),true;}

//            使用三元运算进一步精简版的jquery实现方式

            var v= $(this).prop('checked')?false:true;

            $(this).prop('checked',v);

        })

    }

</script>

</body>

</html>

　　

jquery实现全选，反选，取消的操作的更多相关文章

  1. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

  2. jquery实现全选 反选 取消

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

  3. jquery实现全选，取消，反选的功能&实现左侧菜单

    1.全选,取消,反选的例子 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  4. jquery 书写全选反选功能

    书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  5. jQuery --checkbox全选和取消全选简洁高效的解决办法

    最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...

  6. jquery实现全选/反选功能

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  7. jquery购物车全选，取消全选，计算总金额

    这是html代码 <div class="gwcxqbj"> <div class="gwcxd center"> <div cl ...

  8. jQuery实现全选/反选和批量删除

    <%@ page language="java" contentType="text/html; charset=utf-8"     pageEncod ...

  9. jquery实现全选、取消反选、加JavaScript三元运算（三种法法实现反选）

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

  10. jquery 实现全选反选

    jquery代码 $(function () { $('#inputCheck').click(function () { if ($(this).attr("checked")) ...

随机推荐

  1. NOIP2017 Day2 T1 奶酪(并查集)

    题目描述 现有一块大奶酪,它的高度为 hhh ,它的长度和宽度我们可以认为是无限大的,奶酪 中间有许多 半径相同 的球形空洞.我们可以在这块奶酪中建立空间坐标系,在坐标系中, 奶酪的下表面为z=0z ...

  2. shell 数组中 @ 跟 * 的区别

    关于在shell脚本中数组变量中 “*”跟 “@” 区别 “*”当变量加上“” 会当成一串字符串处理. “@”变量加上“” 依然当做数组处理. 在没有加上“” 的情况下 效果是等效的. #!/bin/ ...

  3. 安装kafka多节点

    安装多节点的kafka只需要创建多份配置文件(server.properties),然后指定他们启动kafka服务即可,本例中采用一台服务器来模拟3个节点的kafka集群搭建.同理,使用一台服务器搭建 ...

  4. shelve模块 xml模块

    # import shelve# f=shelve.open('db.shl')# # f['stu1']={'name':'alex1','age':28}# # f['stu2']={'name' ...

  5. windows 使用 git 客户端

    git客户端下载地址:https://www.git-scm.com/ tortoisegit下载地址:https://tortoisegit.org/ 双击下载的安装包,默认安装直到完成. 打开gi ...

  6. Test 7.12 T2

    题目描述 ​ 有一张 n 个点 m 条边的无向图,其中有 s 个点上有加油站.有 Q 次询问(a,b,c), 问能否开一辆油箱容积为 c 的车从 a 走到 b. 输入格式 ​ 第一行三个整数 n,s, ...

  7. redis学习 --Sorted Set

    一.概述: Sorted Set(有序集合)和Set类型极为相似,它们都是字符串的集合,都不允许重复的成员出现在一个Set中.它们之间的主要差别是Sorted Set中的每一个成员都会有一个分数(sc ...

  8. 理解性能的奥秘——应用程序中慢，SSMS中快（4）收集解决参数嗅探问题的信息

    ---从计划缓存中直接获取查询计划和参数: ), ) SELECT @dbname = 'hydee_连锁', @procname = 'dbo.p_select_ware'; WITH baseda ...

  9. Java网络编程与NIO详解2：JAVA NIO 一步步构建IO多路复用的请求模型

    本文转载自:https://github.com/jasonGeng88/blog 本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到我的仓库里查看 http ...

  10. hook原生打包流程

    将实际执行的Transform换成了MatrixTraceTransform public static void inject(Project project, def variant) { //获 ...