Jquery复选框的全选全不选及选择所有复选框实现全选的复选框
Jquery代码
$(function () {
$(":checkbox.parentfunc").click(function () {
//如何获取被点击的那个复选框
$(this).parent().parent().next().find(":checkbox").prop("checked", this.checked);
});
$(":checkbox:not(.parentfunc)").click(function () {
var td2 = $(this).parent().parent();
var count1 = td2.find(":checked").length; //当前选中的数量
var count2 = td2.find(":checkbox").length;//当前这个td里面有多少个复选框
if (count1 == count2) {
td2.prev().find(":checkbox").prop("checked", true);
}
else {
td2.prev().find(":checkbox").prop("checked", false);
}
})
})
html代码
<body style="font-size: 12px;">
<div class="box">
请编写javascript代码,完成如下功能要求:<br />
1.选中第一列的功能大项后,自动选中该行第二列的所有功能小项。<br />
2.当第二列功能小项没有全部选中时,该行第一列的复选款也要取消选中。<br />
<span>提示:需要使用到额外的两个方法:parent()和find()。请查看帮助自学</span>
</div>
<div class="box">
<table id="table1" class="mytable">
<tr>
<td>
<span>
<input type="checkbox" id="chkPromote" class="parentfunc" />图书管理
</span>
</td>
<td>
<span>
<input type="checkbox" id="Checkbox1" />新增图书管理
</span><span>
<input type="checkbox" id="Checkbox2" />修改图书管理
</span><span>
<input type="checkbox" id="Checkbox3" />删除图书管理
</span>
</td>
</tr>
<tr>
<td>
<span>
<input type="checkbox" id="Checkbox4" class="parentfunc" />会员管理
</span>
</td>
<td>
<span>
<input type="checkbox" id="Checkbox5" />新增会员管理
</span><span>
<input type="checkbox" id="Checkbox6" />修改会员管理
</span><span>
<input type="checkbox" id="Checkbox7" />删除会员管理
</span>
</td>
</tr>
<tr>
<td>
<span>
<input type="checkbox" id="Checkbox8" class="parentfunc" />系统设置
</span>
</td>
<td>
<span>
<input type="checkbox" id="Checkbox9" />管理员设置
</span><span>
<input type="checkbox" id="Checkbox10" />角色管理
</span><span>
<input type="checkbox" id="Checkbox11" />权限管理
</span>
</td>
</tr>
</table>
</div>
</body>
Jquery复选框的全选全不选及选择所有复选框实现全选的复选框的更多相关文章
- Vim 的补全模式加速器,轻松玩转全部 15 种自动补全模式
1. 关于 Vim 补全模式 ---- Vim 一共提供了 15 种自动补全的模式(:help ins-completion).其中有两种的补全列表内容与另外两种相同,只是排序不同,这 15 种 ...
- 转: 如何选CDN:互联网大直播时代的CDN选择指南
from: http://www.chnvideo.com/blog-classic-cdn.html SRS 编码器 如何选CDN:互联网大直播时代的CDN选择指南 CDN是一个服务型的公司, ...
- 如何选CDN:互联网大直播时代的CDN选择指南
转: 如何选CDN:互联网大直播时代的CDN选择指南 from: http://www.chnvideo.com/blog-classic-cdn.html SRS 编码器 如何选CDN:互联网 ...
- jQuery操作复选框checkbox技巧总结 ---- 设置选中、取消选中、获取被选中的值、判断是否选中等
转载:https://blog.csdn.net/chenchunlin526/article/details/77448168 jQuery操作复选框checkbox技巧总结 --- 设置选中.取消 ...
- swift - 全屏imageView的适配 - UIViewContentMode选择
1. /// 设置当前图片view大小 func setFrame(){ if #available(iOS 11.0, *) { if let y = JY_WINDOW?.safeAreaInse ...
- 【微软大法好】VS Tools for AI全攻略(4)——选择适合自己的虚拟机
当我们选择好了自己的虚拟机后,也许效果不尽如人意.就比如我,发现代码在训练一段时间之后,CPU的使用率会下降. 这个时候我们就要开始考虑,是不是我们选择的虚拟机不是适合自己的型号. Azure的虚拟机 ...
- Go 开发关键技术指南 | 为什么你要选择 GO?(内含超全知识大图)
作者 | 杨成立(忘篱) 阿里巴巴高级技术专家 关注"阿里巴巴云原生"公众号,回复 Go 即可查看清晰知识大图! 导读:从问题本身出发,不局限于 Go 语言,探讨服务器中常常遇到的 ...
- Jquery 插件开发——citylinkage(省、市、县城市联动选择)
第一部分:背景 开发源于需求,本次城市联动选择插件算是我写插件的一个特例吧,不是我目前工作需要些的,算是兴趣驱使吧.之前呢,一直想写这个插件,然后错过了一个写这个插件的机会(这个得回顾到很久以前了. ...
- jQuery Autocomplete 用户快速找到并从预设值列表中选择
jQuery Autocomplete 插件根据用户输入值进行搜索和过滤,让用户快速找到并从预设值列表中选择.通过给 Autocomplete 字段焦点或者在其中输入字符,插件开始搜索匹配的条目并显示 ...
- JQuery/JS select标签动态设置选中值、设置禁止选择 button按钮禁止点击 select获取选中值
//**1.设置选中值:(根据索引确定选中值)**// var osel=document.getElementById("selID"); //得到select的ID var o ...
随机推荐
- 用C语言指针作为函数返回值
转载:http://c.biancheng.net/cpp/html/3242.html C语言允许函数的返回值是一个指针(地址),我们将这样的函数称为指针函数.下面的例子定义了一个函数 strlon ...
- 【转】iOS lame编译 arm64 armv7s armv7 x86_64 i386指令集
原文出至 http://blog.csdn.net/vieri_ch/article/details/40650467 最近升级了系统到Mac OS X 10.10 并且更新了XCode6.1和iOS ...
- 安装Chrome driver/ IE driver
2014-08-15 11:38 22100人阅读 评论(0) 收藏 举报 分类: python基础学习(97) >>>安装Chrome driver chrome driver ...
- SQL Server ->> FIRST_VALUE和LAST_VALUE函数
两个都是SQL SERVER 2012引入的函数.用于返回在以分组和排序后取得最后一行的某个字段的值.很简单两个函数.ORDER BY字句是必须的,PARITION BY则是可选. 似乎没什么好说的. ...
- Python初学者第十天 集合、十六进制
10day 数据类型:集合 set 1.集合的定义 集合:无序的.不重复的数据组合. 特性:a.去重,把一个列表变成集合,就自动去重了 b.关系测试.测试两组数据之间的交集.差集.并集等关系 2.集合 ...
- OC基础数据类型-NSNumber
1.NSNumber:专门用来装基础类型的对象,把整型.单精度.双精度.字符型等基础类型存储为对象 //基本数据类型 //专门用来装基础类型的对象 NSNumber * intNumber = [[N ...
- Linux下XAMPP的部署实战
上传源码文件 rz -be 下载xampp安装包wget http://sourceforge.net/projects/xampp/files/XAMPP%20Linux/5.5.28/xampp- ...
- navicat远程连接mysql,2003 can't connect to mysql server on 10038
转载地址:https://blog.csdn.net/f12105212/article/details/70768516 1:我们连接远程服务器的mysql,如果出现问题,很大问题会出在服务器的端口 ...
- Windows Server 2012/2012 R2:安装和配置 SMTP 服务器
Windows Server 2012/2012 R2:安装和配置 SMTP 服务器 安装 SMTP 服务器 以下是安装 SMTP 服务器功能的步骤: 打开“服务器管理器”:单击键盘上的 Window ...
- 一个关于JSON的异常,获取List对象失败的。。。
重要的事情放在最前面,,以后不管遇到什么异常都一定要把异常读懂再想办法怎么解决,把异常读懂,异常读懂...... 这个异常我记得以前遇到过,而且好像已经做了笔记,,,,,今天翻了一下竟然没有,,,,, ...