table中嵌套table，如何用jquery来控制奇偶行颜色

总是要趁着自己还有记忆的时候，把该记录下来的都记录下来，着实是不敢恭维自己的记性。

相信很多时候，我们前端人员，经常会用到table里面的某个td中还嵌套着table，而这个时候还总要去弄奇偶行的颜色，里面那个嵌套的table也要弄。

今天就是这样。如果只是单纯弄最外层的table还好一点。

闲话不多说，先贴个效果图把。

　　当然我不会把全部的代码都贴出来，相信大家也写得出来。

　　首先最外层的table，我们给它一个class="even_a_mid",给最外层的奇偶行赋予颜色

$(".even_a_mid tr:even").css("background","#eee");

　　然后给里面的table赋予颜色，开始需求人员说，这个里面嵌套一个table，所以我的写法是这样的。期间，是遇到一个问题的——$(".even_a_mid tr:eq(index) table tr:even").css("background","red");当我这样写时，就没有效果。原因是——eq作为选择器的时候不支持变量，只支持大于等于0的正整数。当你用变量，负数，小数的时候，程序都会把它转换成0。故而改了下面就ok了。

    var index = $(".even_a_mid tr").has("table").index();$(".even_a_mid tr:eq('"+index+"') table tr:even").css("background","red");

　　事实上，如果里面嵌套多个table，后面的基本没用了。因为$(".even_a_mid tr").has("table")这部分是一个数组，所以index方法则无效了。接下来要做的事情是，要得到遍历这个数组，等得到每行的index，然而事与愿违。所以换了种方式。

$(".even_a_mid tr").has("table").each(function() {$(this).find("table tr:even").css("background","#fff");$(this).find("table tr:odd").css("background","#eee");
});

　　最后终于就ok了。

　　源码链接：http://runjs.cn/detail/vvh9ilip

转载于:https://www.cnblogs.com/wanliyuan/p/3643639.html

table中嵌套table，如何用jquery来控制奇偶行颜色相关推荐

antd 下拉框怎么联动_Antd的Table组件嵌套Table以及选择框联动操作
一.需求在使用Table组件嵌套Table时,父子Table的选择框需要联动,即父Table选中,该行下的子Table需要全选中,某一个子Table全部选中,则该子Table所在的父Table那一行 ...
jQuery:表格的奇偶行变色，jquery实例之表格隔一行
jQuery:表格的奇偶行变色<html> <head> <title>表格变色</title> <style type="text/c ...
HTML中在table的td属性中嵌套table，为什么table居中？
我在表格table的td中又嵌套了一个table,但是table中的东西会呈现垂直居中的状态,那么问题是什么,是其table继承了vertical-align: inherit属性 vertical- ...
table无限嵌套table
需要达到的效果: table无限嵌套,需要达到:长度不确定,列数不固定,表头不一致关键 ===> 组件自己调用自己,递归调用在模板中使用name属性值,来调用自己一.非懒加载二.懒加载 ...
html奇偶行颜色,jquery实现奇偶行不同颜色的方法
jquery实现奇偶行不同颜色的方法发布时间:2020-12-28 09:12:07 来源:亿速云阅读:74 作者:小新这篇文章主要介绍了jquery实现奇偶行不同颜色的方法,具有一定借鉴价值, ...
【 iview 实践指南】之如何优雅地在Table中嵌套Input（代码篇）
iview 版本 3.2.0 + template 部分: <template><div><Table class="data-manage-table&quo ...
JavaSelenium处理页面Table以及Table中随机位置的数据
一.摘要前一段时间公司小伙伴刚刚接触自动化,遇到的一个问题,页面新创建的数据保存后,出现在table中的某个位置,并不一定是第一行还是第几行,这种情况下如何去操控它本篇博文将介绍处理这个问题的一种 ...
html表格td点击事件,监听layui中的table中的td点击事件
上图就是用layui生成的一个table表格; 在这里我们给td绑定class,再通过jq的方式去监听是不可行的; 会监听不到事件; 不过在layui中,给了监听方法,并且还可以获取到该行所有的数据 ...
data.table中选择列与data.frame的区别: This difference to data.frame is deliberate and explained in FAQ 1.1.
太长不看版 data.table格式在调用列时, 加上逗号, 如果是字符串, 加上with=FALSE trait = "yield" dat[,trait,with=F] 使用o ...

table中嵌套table，如何用jquery来控制奇偶行颜色

table中嵌套table，如何用jquery来控制奇偶行颜色相关推荐

最新文章

热门文章