jQuery--全选、反选、取消
主要知识点:
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--全选、反选、取消的更多相关文章
- python: jquery实现全选 反选 取消
引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...
- jQuery全选反选实例
1. $('#tb:checkbox').each(function(){ 每次都会执行 全选-取消操作,注意$('#tb :checkbox').prop('checked',true); tb后面 ...
- jQuery全选/反选checkbox
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 关于JQuery全选/反选第二次失效的问题
最近在项目中,遇到一个问题,测试全选/反选功能时,第一次对母框进行选中/非选中时,能同步子框的全选/反选状态,之后再点击母框,子框就没反应了.原代码大致结构关键如下: function selectA ...
- jQuery全选反选插件
(function($){ $.fn.check = function(options){ var options = $.extend({ element : "input[name='n ...
- JQuery 全选 反选 获取Table 中指定td的元素值
//全选 function initTableCheckbox() { var $thr = $('table thead tr'); var $checkAllTh = $('<th>& ...
- jquery全选 反选
//全选 反选 $('#chkAll').on('click',function(){ $('input.chkbox').prop('checked',$(this).prop('checked') ...
- jquery实现全选 反选 取消
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 关于jquery全选反选 批量删除的一点心得
废话不多说直接上代码: 下面是jsp页面的html代码: <table id="contentTable" class=""> <thead& ...
- jquery全选反选
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- 10 结构体和类 - —— 《Swift3.0 从入门到出家》
Swift中的面向对象5个要素:枚举.结构体.类.协议.扩展 面向对象研究的是对象,完成一件事情需要多个对象参与,是生活的映射 Swift中结构体和类非常相似,也就是结构体能完成类的所有功能.结构体是 ...
- AGC006 C Rabbit Exercise——思路(置换)
题目:https://agc006.contest.atcoder.jp/tasks/agc006_c 选了 i 位置后 x[ i ] = x[ i-1 ] + x[ i+1 ] - x[ i ] . ...
- SVN报错:sqlite[S5]:database is locked
昨天下午修改几个冲突的jar包后提交svn后报错,接下来svn操作就失灵了,无论是clean up还是revert还是release lock都无济于事.解决办法: 首先下载sqlite3,我的是64 ...
- gson在android中的应用
首先需要建一个实体类 Person.java 来对应json 需要注意的是实体类中的变量名必须和json传过来的key值完全一样(大小写) public class Person { private ...
- qt的下载地址
上Qt官网http://www.qt.io/download/想下载Qt,速度很慢,在这里记录下在Qt官网看到的镜像下载地址: 1. 所有Qt版本下载地址: http://download.qt.io ...
- cowboy的例子
大体参考的这里,非常感谢他的例子 开发的时候先下载好cowboy的库,放到~/.erlang里面 code:add_pathz("/Users/mmc/erlang/3rd_libs/cow ...
- An invalid form control with name='timeone[]' is not focusable.
在项目开发的时候 遇到了这样的报错 An invalid form control with name='timeone[]' is not focusable. 学习源头:https://segme ...
- 南阳OJ 1170 最大的数
最大的数 时间限制:1000 ms | 内存限制:65535 KB 难度:3 描述 小明和小红在打赌说自己数学学的好,于是小花就给他们出题了,考考他们谁NB,题目是这样的给你N个数 在这n个数 ...
- MySQL-事务的实现-redo
MySQL中事务: 事务的实现: ACID: 原子性(A : Atomicity) 一致性(C : consistency ) 隔离性(I : isolation) 持久性(D : dura ...
- Linux性能监测:网络篇
网络的监测是所有 Linux 子系统里面最复杂的,有太多的因素在里面,比如:延迟.阻塞.冲突.丢包等,更糟的是与 Linux 主机相连的路由器.交换机.无线信号都会影响到整体网络并且很难判断是因为 L ...