主要知识点:

prop()--主要检查和设置checked

attr()是针对所有属性,prop()是针对checked和selected等单一存在的,判断他们的true或者false。

find()是在子子孙孙中去查找

$(元素).each(){}--循环每个元素,可以这样用;循环一个数组,就要$.each(arry,function(){})。

代码:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <input type="button" value="全选" onclick="CheckAll()"/>
    <input type="button" value="反选" onclick="CheckReverse()"/>
    <input type="button" value="取消" onclick="CheckCancel()"/>
 
    <table border="1">
        <thead></thead>
        <tbody id="tb1">
            <tr>
                <td><input type="checkbox" /></td>
                <td>11</td>
            </tr>
            <tr>
                <td><input type="checkbox" /></td>
                <td>22</td>
            </tr>
            <tr>
                <td><input type="checkbox" /></td>
                <td>33</td>
            </tr>
        </tbody>
    </table>
    <script type="text/javascript" src="jquery-2.1.4.min.js"></script>
    <script type="text/javascript">
        function CheckAll(){
            $('#tb1').find(':checkbox').prop('checked',true);
        }
        function CheckReverse(){
            $('#tb1').find(':checkbox').each(function(){
                //$(this)=每一个复选框
                //$(this).prop('checked')如果选中,true,否则false
                if ($(this).prop('checked')){
                    $(this).prop('checked',false);
                }else{
                    $(this).prop('checked',true);
                }
            });
        }
        function CheckCancel(){
            $('#tb1').find(':checkbox').prop('checked',false);
        }
    </script>
</body>
</html>
效果:​

jQuery--全选、反选、取消的更多相关文章

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

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

  2. jQuery全选反选实例

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

  3. jQuery全选/反选checkbox

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

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

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

  5. jQuery全选反选插件

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

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

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

  7. jquery全选 反选

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

  8. jquery实现全选 反选 取消

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

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

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

  10. jquery全选反选

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

随机推荐

  1. self = [super init]

    Objective-C的推荐init方法写法如下: - (id) init { if(self = [super init]) { //为子类增加属性进行初始化 } return self; } 返回 ...

  2. [Luogu4475]巧克力王国

    luogu 题意 平面上有\(n\)个点,每个点\((x_i,y_i)\),价值为\(w_i\).\(m\)次询问,每次给出\(a_i,b_i,c_i\)求满足\(a_ix+b_iy<c_i\) ...

  3. 记录几个基础的SQL开发题

    1. 表A有5行数据,表B有7行数据,问Inner Join最多返回几行数据,Left Join最多返回几行数据,分别在什么情况下? Inner Join 是返回关联表的Cartesian produ ...

  4. Hadoop体系结构之 Yarn

    1.1 YARN 基本架构 YARN是Hadoop 2.0中的资源管理系统,它的基本设计思想是将MRv1中的JobTracker拆分成了两个独立的服务:一个全局的资源管理器ResourceManage ...

  5. 第21篇 ubuntu安装ftp服务器(转载)

    ubuntu安装ftp服务器 1: 安装vsftpd ~$ sudo apt-get install vsftpd ubuntu10.10自己装了,这步省略. 2: 配置vsftpd 2.1 修改vs ...

  6. gen_fsm的学习笔记

    网上搜索gen_fsm的例子,90%都是code_lock,依葫芦画瓢弄了下,记录一些学习心得 init(UnLockCode) -> process_flag(trap_exit,true), ...

  7. Mac电脑Tomcat下载及安装(详细)

    下载Tomcat 1.打开Apache Tomcat官网,选择你需要的版本进行下载: 地址http://tomcat.apache.org/download-70.cgi   2.解压apache-t ...

  8. 【转】Jmeter和LR上传文件和下载

    背景: 在某个申请业务中,需要上传附件文件,然后才能提交该申请 遇到的问题: 1,  在使用Jmeter或者LR进行录制时,无法录制到上传文件的请求,只能通过Fiddler能查看到该请求 2,  因为 ...

  9. 分布式缓存系统 Memcached 状态机之SET、GET命令

    首先对状态机中的各种状态做个简单总结,具体可见状态转换示意图: 1.listening:这个状态是主线程的默认状态,它只有这一个状态:负责监听socket,接收客户连接,将连接socket派发给工作线 ...

  10. 杂项-EMS:目录

    ylbtech-杂项-EMS:目录 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部     6.返回顶部   7.返回顶部   8.返回顶部   9.返回顶部   ...