复选框怎么点td选中_jQuery点击tr实现checkbox选中的方法

标题描述的有点不贴切,但希望大家能够明白,为了更形像的表达,我特意录制了一张GIF动画图片。

我不知道实际开发中有没有用到这种效果,但我个人认为,这种方式更人性化,因为只要点到一行,就可以使CheckBox.checked=true; 不用非得点复选按钮才能实现;

实现的过程有点纠结,试了几次都没成,最后用了一个笨笨的方法,就是点击行的时候,让他的子元素(td)的背景颜色为红色.(因为我用到了光棒效果,如果我点击行(td)的时候,颜色是变了,但鼠标一离开的时候就又变回原来的颜色了)

可能你会问我了,那你咋判断CheckBox的状态是不是checked(勾选状态)啊?

其实我根本没去对它进行判断.... 希望大家不要喷我。我只是判断了一下选中行的子元素(td)的背景颜色和document.body的背景颜色是不是一样,如果一样,就让CheckBox.checked=true,不一样就让CheckBox.checked=false.

思路就是这么个思路,如果谁还有更好的方法贴上来,大家一起学习学习..

Jquery中用到的方法:

first():第一个元素;

nextAll():在XX之后的所有元素:主要为了把第一行的表头去掉

children():查找子元素;

toggleClass();切换样式

attr():给CheckBox添加checked属性;

主要实现的代码:

$(function () {

//除了表头(第一行)以外所有的行添加click事件.

$("tr").first().nextAll().click(function () {

//为点击的这一行切换样式bgRed里的代码:background-color:#FF0000;

$(this).children().toggleClass("bgRed");

//判断td标记的背景颜色和body的背景颜色是否相同;

if ($(this).children().css("background-color") != $(document.body).css("background-color")) {

//如果相同,CheckBox.checked=true;

$(this).children().first().children().attr("checked", true);

} else {

//如果不同,CheckBox.checked=false;

$(this).children().first().children().attr("checked", false);

}

});

});

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/496638.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

谷歌大脑AutoML最新进展:用进化算法发现神经网络架构

来源:AI中国大脑的进化进程持续已久,从5亿年前的蠕虫大脑到现如今各种现代结构。例如,人类的大脑可以完成各种各样的活动,其中许多活动都是毫不费力的。例如,分辨一个视觉场景中是否包含动物或建筑物对我们来说是微不足…

股票名词解释

开盘价:   是指当日开盘后该股票的第一笔交易成交的价格。如果开市后30分钟内无成交价,则以前日的收盘价作为开盘价。 收盘价:   指每天成交中最后一笔股票的价格,也就是收盘价格。 最高价:   是指当日所成交的…

linux 的 ip 命令 和 ifconfig 命令

From(试试Linux下的ip命令,ifconfig已经过时了): https://linux.cn/article-3144-1.html From(linux网络配置命令之ifconfig、ip和route): http://chrinux.blog.51cto.com/6466723/1188108 From…

SM4算法

文章目录前言一、SM4是什么?二、go语言实现前言 提示:以下是本篇文章正文内容,下面案例可供参考 一、SM4是什么? SM4.0(原名SMS4.0)是中华人民共和国政府采用的一种分组密码标准,由国家密码管…

Java并发编程实战~软件事务内存

很多同学反馈说,工作了挺长时间但是没有机会接触并发编程,实际上我们天天都在写并发程序,只不过并发相关的问题都被类似 Tomcat 这样的 Web 服务器以及 MySQL 这样的数据库解决了。尤其是数据库,在解决并发问题方面,可…

python list去重时间复杂度_List集合去重的一种方法 z

需要对一个List集合去重,情况是该集合中会出现多个Name属性值相同的,但是其他属性值不同的数据。在这种情况下,需求要只保留其中一个就好。我觉得遍历和HashSet都不是我想要的,便采用了一下方式定义Compare类,继承IEqu…

对于Office Live平台的思考

刚接触计算机编程的时候,脑子里想法比肚子里的墨水多得多,那时候想通过网络成立一个游戏开发团队,将不少人都很喜欢的一款FC游戏“重装机兵”(Metal Max)移植到电脑上来。当时的想法很激进也很宏大,我想的不…

中国学者用人工光感受器助失明小鼠复明

来源:《自然—通讯》中国研究人员在英国《自然通讯》杂志上发表报告说,他们通过在失明小鼠眼底植入一种新研发的人工光感受器,让它们的视觉得以恢复。如果这种技术发展成熟,未来或许能帮助因黄斑变性等疾病而视力下降或失明的患者…

PoW算法

文章目录前言一、PoW——工作量证明二、go语言简单案例前言 提示:以下是本篇文章正文内容,下面案例可供参考 一、PoW——工作量证明 ⚫ Proof-of-Work 简称 PoW,即为工作量证明 ⚫ 通过计算一个数值,使得拼揍上交易数据后内容的…

systemctl 命令完全指南

From:https://linux.cn/article-5926-1.html systemctl命令是系统服务管理器指令,它实际上将 service 和 chkconfig 这两个命令组合到一起。 任务 旧指令 新指令 使某服务自动启动 chkconfig --level 3 httpd on systemctl enable httpd.service 使某服务不自…

boundcolumn 根据值进行判断_Excel使用函数进行条件判断的方法步骤

Excel中的函数具体该如何进行判断数据的条件是否达到要求呢?下面是学习关于excel使用函数进行条件判断的教程,希望阅读过后对你有所启发! excel使用函数进行条件判断的教程 函数条件判断步骤1:如何计算成绩是否合格 函数条件判断步骤2:选中要…

城市大脑不仅是AI系统,更是结合人类智慧的混合智能巨系统

作者:刘锋 《互联网进化论》作者从2015年开始,智慧城市的类脑化进程不断加速,包括城市大脑,城市云脑,城市神经系统,智慧城市脑,交通大脑等概念不断涌现,人工智能成为当前科技热点的今…

转载:ListBox的SelectedValue和SelectedItem的区别

转载:ListBox的SelectedValue和SelectedItem的区别 原文:http://www.beacosta.com/blog/?p9What is the difference between SelectedValue and SelectedItem? When they are used by themselves, these two properties are very similar. The need fo…

区块链简单实现

前言 提示:以下是本篇文章正文内容,下面案例可供参考 一、区块链简单实现 package Blockimport ("crypto/sha256""encoding/hex""fmt""strconv""strings""time" )type Block struct{Pre…

charts漏斗图表_用echarts写的转换率图表(漏斗图 + 象形柱图)

平时用图表可能都是常规的折线图,柱状图,饼图这些基本的。下面的是一个漏斗图 象形柱图写出来的图表。完成后的图表,关键是右半边漏斗图很简单,只讲下象形柱图里的几个关键点(因为这里的用法有点特别,不是文档里的常规…

Java并发编程实战~协程

Golang 是一门号称从语言层面支持并发的编程语言,支持并发是 Golang 一个非常重要的特性。在上一篇文章《44 | 协程:更轻量级的线程》中我们介绍过,Golang 支持协程,协程可以类比 Java 中的线程,解决并发问题的难点就在…

SQL的经典语句(太全了)

关键字: sql语句 查询表内容 SELECT 表名case when a.colorder1 then d.name else end, 表说明case when a.colorder1 then isnull(f.value,) else end, 字段序号a.colorder, 字段名a.name, 标识case when COLUMNPROPERTY( a.id,a.name,IsIdentity)1 then √else end, 主键…

上帝的指纹——分形与混沌

来源:王东明科学网博客云朵不是球形的,山峦不是锥形的,海岸线不是圆形的,树皮不是光滑的,闪电也不是一条直线。——分形几何学之父Benoit Mandelbrot话说在一个世纪以前,数学领域相继出现了一些数学鬼怪&am…

PoS算法

文章目录前言一、PoS——权益证明二、go语言简单实现前言 提示:以下是本篇文章正文内容,下面案例可供参考 一、PoS——权益证明 PoS 是什么 ⚫ PoS(Proof of Stake)译为权益证明,是一种在公链中的共识算法&#xf…

mysql 内存 256m_解决mySQL占用内存超大问题

为了装mysql环境测试,装上后发现启动后mysql占用了很大的虚拟内存,达8百多兆。网上搜索了一下,得到高人指点my.ini。再也没见再详细的了..只好打开my.ini逐行的啃,虽然英文差了点,不过多少M还是看得明的^-^更改后如下&…