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 ...
随机推荐
- androidcode
package UICtrl; import android.animation.ObjectAnimator;import android.content.Context;import androi ...
- Java—IO流 字节流
IO流(输入流.输出流),又分为字节流.字符流. 流是磁盘或其它外围设备中存储的数据的源点或终点. 输入流:程序从输入流读取数据源.数据源包括外界(键盘.文件.网络…),即是将数据源读入到程序的通信通 ...
- 使用Axure管理团队项目以及分享原型
第一部分:使用Axure管理团队项目 首先,你要有一个Axure账户 呵呵哒.注册地址:http://share.axure.com 发起团队项目 在浏览器登录 Axure share(网速很卡很卡) ...
- LeetCode-Maximal Rectangle[code]
code: #include <iostream> #include <vector> #include <stack> #include <algorith ...
- 爬虫入门之Scrapy框架基础框架结构及腾讯爬取(十)
Scrapy终端是一个交互终端,我们可以在未启动spider的情况下尝试及调试代码,也可以用来测试XPath或CSS表达式,查看他们的工作方式,方便我们爬取的网页中提取的数据. 如果安装了 IPyth ...
- centos7和centos6区别
CentOS 7 vs CentOS 6的不同 (1)桌面系统[CentOS6] GNOME 2.x[CentOS7] GNOME 3.x(GNOME Shell) (2)文件系统[CentOS6 ...
- Python学习---模版/包的概念
1.1. 模块/包的概念 在Python中,一个.py文件就称之为一个模块(Module) 模块一共三种: python标准库 第三方模块 应用程序自定义模块 模块的使用:模块是用来组织函数的 解释器 ...
- springMVC+mybatis事务管理总结
1.spring,mybatis事务管理配置与@Transactional注解使用: 概述事务管理对于企业应用来说是至关重要的,即使出现异常情况,它也可以保证数据的一致性.Spring Framewo ...
- AngularJS应用的启动和执行过程
启动(startup): <!doctype html> <html ng-app> <head> <script src="http://code ...
- JSON解析问题
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/quanqinayng/article/details/25121955 这是data.chatFil ...