JQuery案例二:实现全选、全不选和反选
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>全选和全不选以及反选</title>
<script src="../js/jquery-1.8.3.js"></script>
<script>
$(function() {
//全选事件
$("#checkedAll").click(function() {
$(".checkedOne").attr("checked",this.checked);
});
$("#reSelect").click(function() {
$(".checkedOne").each(function() {
this.checked = !this.checked;
});
});
});
</script>
</head>
<body>
<table id="tbl" border="1" border-collapse="collapse" align="center" cellspacing="0" cellpadding="5" width="400" height="20">
<thead>
<tr>
<th><input type = "checkbox" id="checkedAll">全选</input></th>
<th>编号</th><th>姓名</th><th>年龄</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>1</td><td>张三</td><td>12</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>2</td><td>李四</td><td>22</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne" /></td>
<td>3</td><td>王五</td><td>13</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>4</td><td>马六</td><td>14</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>5</td><td>伍六七</td><td>17</td>
</tr>
<tr>
<td><input type="checkbox" class="checkedOne"/></td>
<td>6</td><td>梅花十三</td><td>17</td>
</tr>
<tr>
<td colspan=4><input type="button" value="反选" id="reSelect" /></td>
</tr>
</tbody>
</table>
</body>
</html>
JQuery案例二:实现全选、全不选和反选的更多相关文章
- 全选全不选案例table表格
全选全不选案例table表格 案例一纯table表格 <table class="table table-bordered"> <thead class=&quo ...
- jquery之全选全不选
<input type="checkbox" onclick="selall(this)" />全选/全不选 <input type=&quo ...
- jquery实现全选、不选、反选的两种方法
在取复选框checkbox的属性checked属性值时,发现一个问题,就是当用attr取值时,真的为"checked",假的为"undefined";当用pro ...
- Dynamic CRM 2013学习笔记(二十六)报表设计:Reporting Service报表 动态参数、参数多选全选、动态列、动态显示行字体颜色
上次介绍过CRM里开始报表的一些注意事项:Dynamic CRM 2013学习笔记(十五)报表入门.开发工具及注意事项,本文继续介绍报表里的一些动态效果:动态显示参数,参数是从数据库里查询出来的:参数 ...
- jQuery/javascript实现全选全不选
<html> <head> <meta charset="utf-8"> <title>Checkbox的练习</title& ...
- jQuery实现Checkbox中项目开发全选全不选的使用
<html> <head> <meta charset="utf-8"> <title>Checkbox的练习</title& ...
- 利用jQuery实现CheckBox全选/全不选/反选
转自:http://www.cnblogs.com/linjiqin/p/3148259.html jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3. ...
- jquery的全选/全不选/反选以及attr添加checked属性失败的解决办法
如下图: <head> <title></title> <style type="text/css"> div { border: ...
- 【七】jquery之属性attr、 removeAttr、prop[全选全不选及反选]
全选全不选 界面: 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...
随机推荐
- Bootstrap3基础 栅格系统 col-md-push/pull 向左、右的浮动偏移
内容 参数 OS Windows 10 x64 browser Firefox 65.0.2 framework Bootstrap 3.3.7 editor ...
- vue3.0使用axios报错问题记录
vue-cli3.0使用axios的时候出现错误,记录一下 报错信息: Uncaught TypeError: Cannot set property $axios of #<Vue> w ...
- selenium 文件上传
一般分两个场景:一种是input标签,这种可以用selenium提供的send_keys()方法轻松解决: 另外一种非input标签实现起来比较困难,可以借助autoit工具或者SendKeys第三方 ...
- CMS收集器产生的问题和解决方案
垃圾收集器长时间停顿,表现在 Web 页面上可能是页面响应码 500 之类的服务器错误问题,如果是个支付过程可能会导致支付失败,将造成公司的直接经济损失,程序员要尽量避免或者说减少此类情况发生. 提升 ...
- JQ清空select的已选择状态
$('#payment').find("option:selected").attr("selected", false);
- 关于查询ios的app更新的历史版本记录
https://www.qimai.cn 推荐七麦数据 可以查询app的各种版本更新内容 由于历史久远忘记了自己app第一次上架的时间 通过这个可以查询
- 承接Unity外包 U3D外包 Unity3D外包 小型Unity项目外包用Unity还是UE4
转自mobilehub公众号(ID: mobilehub),作者:屠敏 VR浪潮席卷而来,相对于资本的狂热,现实中真正需要的是有实力的VR硬件研发团队和专业内容制作队伍.对于入门级的开发者而言,游戏引 ...
- spring cloud 初体验
spring cloud分为注册端.客户端以及消费端 初体验的理解就是: 注册端就是将之前所有的应用在这边进行注册,然后给每个应用都生成自己的标识,这些应用就是来自于客户端,消费端则通过调用注册端(有 ...
- 安装PyCharm开发工具
1.进入PyCharm官网 http://www.jetbrains.com/pycharm/ 2.点击现在下载 3.选择windows版本 4.打开安装程序 5.下一步,选择安装路径,安装 6.安装 ...
- CF Manthan, Codefest 16 B. A Trivial Problem
数学技巧真有趣,看出规律就很简单了 wa 题意:给出数k 输出所有阶乘尾数有k个0的数 这题来来回回看了两三遍, 想的方法总觉得会T 后来想想 阶乘 emmm 1*2*3*4*5*6*7*8*9 ...