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 ...
随机推荐
- 基于以太坊的Token开发步骤
Token开发步骤 一.准备工具1.安装以太坊brew tap ethereum/ethereumbrew install ethereum2.node:brew install nodejs3.安装 ...
- SQLite入门(二)读写二进制数据
//读二进制数据的函数 BOOL OpenBinDataFile(BYTE **pBUf,UINT &len) { if (pBUf == NULL) { re ...
- java线程方法join的总结
虽然关于讨论线程join方法的博客已经很多了,不过个人感觉挺多都讨论得不够全面,所以我觉得有必要对其进行一个全面的总结. 一.作用 Thread类中的join方法的主要作用就是同步,它可以使得线程之间 ...
- https填坑之旅
Boss说,我们买了个权威证书,不如做全站式的https吧,让用户打开主页就能看到受信任的绿标.于是我们就开始了填坑之旅. [只上主域好不好?] 不好...console会报出一大堆warning因为 ...
- 年金(annuity)
一.定义 一系列的付款(或收款),付款时间和付款金额具有一定规律性. 二.分类 1-支付时间和支付金额是否确定?确定年金(annuity-certain)风险年金(contingent annuity ...
- java native方法及JNI实例
前言 今天在读java.lang.Object 源码中时发现一个 一个hashCode方法: public native int hashCode() 原因Java很好,使用的人很多.应用极广,但是J ...
- 问题解决:java.sql.SQLException:Value '0000-00-00' can not be represented as java.sql.Date
问题描述: 数据表中有记录的time字段(属性为timestamp)其值为:“0000-00-00 00:00:00” 程序使用select 语句从中取数据时出现以下异常: Java.sql.SQLE ...
- 牛客网多校训练第一场 A - Monotonic Matrix(Lindström–Gessel–Viennot lemma)
链接: https://www.nowcoder.com/acm/contest/139/A 题意: 求满足以下条件的n*m矩阵A的数量模(1e9+7):A(i,j) ∈ {0,1,2}, 1≤i≤n ...
- TraceWrite waittype
今天上午突然开发人员叫起来说数据库非常慢,马上连上数据查看. 使用sp_who2和下面脚本可以看到大量的TraceWrite 等待事件.我的第一反应就是有人启用的Profiler在生产服务器上抓数据了 ...
- Yii2 配置发送邮件
'components' => [ 'mailer' => [ 'class' => 'yii\swiftmailer\Mailer', 'viewPath' => '@com ...