勾中行变色效果的实现方法介绍
点击复选框添加样式,勾中行变色效果的实现方法介绍,具体实现方法如下
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" ""> <html xmlns="" xml:lang="en" lang="en"> <head> <meta charset="UTF-8"> <title></title> <style>table { border: 0; border-collapse: collapse; } td { font: normal 12px/17px Arial; padding: 2px; width: 100px; } th { font: bold 12px/17px Arial; text-align: left; padding: 4px; border-bottom: 1px solid #333; } .even { background: #FFF38F; }/* 偶数行样式*/.odd { background: #FFFFEE; }/* 奇数行样式*/.selected { background: #FF6500; color: #fff; }</style> <script src="js/jquery-1.11.3.min.js" type="text/javascript"></script> <script type="text/javascript">$(function () { $("tbody tr:even").addClass("even"); $("tbody tr:odd").addClass("odd"); $(":checkbox").change(function () {if ($(this).is(":checked")) { $(this).parents("tr").addClass("selected"); }else{ $(this).parents("tr").removeClass("selected"); } });//初始化默认选中色selected样式$(":checkbox").each(function () {if ($(this).is(":checked")) { $(this).parents("tr").addClass("selected"); } }) })</script> </head> <body> <table> <thead> <tr> <th></th> <th>姓名</th> <th>性别</th> <th>暂住地</th> </tr> </thead> <tbody> <tr> <td><input type="checkbox" name="choice" value=""/></td> <td>张山</td> <td>男</td> <td>浙江宁波</td> </tr> <tr> <td><input type="checkbox" name="choice" value=""/></td> <td>李四</td> <td>女</td> <td>浙江杭州</td> </tr> <tr> <td><input type="checkbox" name="choice" value="" checked='checked'/></td> <td>王五</td> <td>男</td> <td>湖南长沙</td> </tr> <tr> <td><input type="checkbox" name="choice" value=""/></td> <td>找六</td> <td>男</td> <td>浙江温州</td> </tr> <tr> <td><input type="checkbox" name="choice" value=""/></td> <td>Rain</td> <td>男</td> <td>浙江杭州</td> </tr> <tr> <td><input type="checkbox" name="choice" value=""/></td> <td>MAXMAN</td> <td>女</td> <td>浙江杭州</td> </tr> </tbody> </table> </body> </html>
//点击行添加样式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><meta charset="UTF-8"><title></title><style>table {border: 0;border-collapse: collapse;}td {font: normal 12px/17px Arial;padding: 2px;width: 100px;}th {font: bold 12px/17px Arial;text-align: left;padding: 4px;border-bottom: 1px solid #333;}.even {background: #FFF38F;}/* 偶数行样式*/.odd {background: #FFFFEE;}/* 奇数行样式*/.selected {background: #FF6500;color: #fff;}</style><script src="js/jquery-1.11.3.min.js?1.1.11" type="text/javascript"></script><script type="text/javascript">$(function () { $("tbody tr:even").addClass("even"); $("tbody tr:odd").addClass("odd"); $("tbody tr").click(function () {var hasselect = $(this).hasClass("selected");if (hasselect) { $(this).removeClass("selected"); $(this).find("input").attr("checked", false); } else { $(this).addClass("selected"); $(this).find("input").attr("checked", true); } }) $('tbody>tr:has(:checked)').addClass('selected');// $(":checkbox").each(function () {// if ($(this).is(":checked")) {// $(this).parents("tr").addClass("selected");// }// })})</script></head><body><table><thead><tr><th></th><th>姓名</th><th>性别</th><th>暂住地</th></tr></thead><tbody><tr><td><input type="checkbox" name="choice" value=""/></td><td>张山</td><td>男</td><td>浙江宁波</td></tr><tr><td><input type="checkbox" name="choice" value=""/></td><td>李四</td><td>女</td><td>浙江杭州</td></tr><tr><td><input type="checkbox" name="choice" value="" checked='checked'/></td><td>王五</td><td>男</td><td>湖南长沙</td></tr><tr><td><input type="checkbox" name="choice" value=""/></td><td>找六</td><td>男</td><td>浙江温州</td></tr><tr><td><input type="checkbox" name="choice" value=""/></td><td>Rain</td><td>男</td><td>浙江杭州</td></tr><tr><td><input type="checkbox" name="choice" value=""/></td><td>MAXMAN</td><td>女</td><td>浙江杭州</td></tr></tbody></table></body></html>
以上是勾中行变色效果的实现方法介绍的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

热门话题

你可能遇到过智能手机屏幕出现绿色线条的问题,即使没见过,也一定在网络上看到过相关图片。那么,智能手表屏幕变白的情况你遇见过吗?4月2日,CNMO从外媒了解到,一名Reddit用户在社交平台上分享了一张图片,展示了三星Watch系列智能手表屏幕变白的情况。该用户写道:"我离开时正在充电,回来时就这样了,我尝试重启,但重启过程中屏幕还是这样。"三星Watch智能手表屏幕变白这位Reddit用户并未指明这款智能手表的具体型号。不过,从图片上看,应该是三星Watch5。此前,另一位Reddit用户也报告

说起阿萨辛ASSASSIN,相信玩家们一定会想到《刺客信条》中的各位刺客大师,不仅身手了得,而且"躬身于黑暗、服务于光明"的信条,与国内知名机箱/电源/散热器品牌九州风神(DeepCool)旗下的阿萨辛ASSASSIN系列旗舰级风冷散热器不谋而合。最近,该系列的最新产品阿萨辛ASSASSIN4S重磅上线,"西装刺客,再进阶"为高级玩家带来全新的风冷散热体验。外观一览细节满满阿萨辛4S散热器采用双塔构造+单风扇内嵌设计,外面包覆立方体造型的整流罩,整体感极强,并提供白、黑两种配色可选,满足不同色系

微软公司推出的win10系统相较于之前的版本新增了许多功能,比如可以通过颜色筛选器,也就是颜色滤镜快捷方式使win10整体的显示变成黑白两色。有的小伙伴可能还不知道这种效果要怎么设置才能实现。那么现在就让小编来告诉你吧。希望可以帮助到你~win10变黑白的快捷键是什么解决方法1.可以使用快捷方式++开启或者关闭颜色滤镜2.如果想要彻底关闭颜色滤镜,可以在任务栏右击开始徽标,在弹出菜单选择选项3.在打开的界面选择选项4.在打开的左侧轻松使用栏选择选项5.在打开页面右侧的颜色滤镜界面我们会看到有一个

随着春天的到来,万物复苏,一切都充满了生机与活力。在这个美好的季节里,如何为家居生活增添一抹别样的色彩?哈趣H2投影仪,以其精致的设计和超高的性价比,成为了这个春天里不可或缺的一道亮丽风景。这款H2投影仪小巧玲珑却不失时尚。无论是放在客厅的电视柜上,还是卧室的床头柜旁,都能成为一道亮丽的风景线。它的机身采用了奶白色的磨砂质地,这种设计不仅让投影仪的外观更显高级,同时也增加了触感的舒适度。米色仿皮纹材质,更是为整体外观增添了一抹温馨与雅致。这种色彩与材质的搭配,既符合现代家居的审美趋势,又能够融入

ITX平台以小巧的身形吸引了不少追求极致和独特美感的玩家,随着制程的提升和技术的进步,英特尔第14代酷睿和RTX40系显卡都可以在ITX平台中发挥实力,游戏玩家也对SFX电源有了更高的要求。游戏爱好者航嘉推出新的MX系列电源,在满足高性能需求的ITX平台中,MX750P全模组电源的定额功率高达750W,同时通过了80PLUS白金级认证。以下我们就带来这款电源的评测。航嘉MX750P全模组电源采用了简约时尚的设计理念,共有黑白两款供玩家选择,均采用磨砂表面处理,搭配银灰色和红色的字体有很好的质感,

一个可以自动分析PDF、网页、海报、Excel图表内容的大模型,对于打工人来说简直不要太方便。上海AILab,香港中文大学等研究机构提出的InternLM-XComposer2-4KHD(简写为IXC2-4KHD)模型让这成为了现实。相比于其他多模态大模型不超过1500x1500的分辨率限制,该工作将多模态大模型的最大输入图像提升到超过4K(3840x1600)分辨率,并支持任意长宽比和336像素~4K动态分辨率变化。发布三天,该模型就登顶HuggingFace视觉问答模型热度榜单第一。轻松拿捏

在当下科技飞速发展的时代,笔记本电脑已经成为人们日常生活和工作中不可或缺的重要工具。对于那些对性能有高要求的玩家而言,拥有配置强大、性能出色的笔记本电脑才能满足其硬核需求。七彩虹隐星P15笔记本电脑凭借其卓越性能和令人惊艳的设计,成为了未来的引领者,堪称硬核笔记本的典范。七彩虹隐星P1524配备了13代英特尔酷睿i7处理器和RTX4060LaptopGPU,外观采用更时尚的宇宙飞船设计风格,同时在细节表现上也有出色表现。让我们先来了解一下这款笔记本的特点。至高搭载英特尔酷睿i7-13620H处理

在当今智能手机市场中,屏幕素质已经成为衡量一款手机综合性能的关键指标之一。iQOO旗下的Neo系列一直致力于为用户提供出色的游戏体验和视觉享受,最新款产品iQOONeo9SPro+更是采用一块"三好护眼电竞屏",接下来我们就来一起看看这块屏幕的素质有多出色。iQOONeo9SPro+搭载了一块1.5KOLED电竞直屏,支持从1Hz到144Hz的旗舰级LTPO自适应刷新率,意味着在显示静态内容时能够实现超低功耗的待机状态,而在游戏过程中也能智能切换至90Hz至144Hz的动态高
