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

相信很多时候,我们前端人员,经常会用到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

table中嵌套table,如何用jquery来控制奇偶行颜色的更多相关文章

  1. iview之——table中嵌套input、select等

    使用iview在table中嵌入button是比较常见的需求,但是在table中嵌入input或者select你是否考虑过呢?本文用实例介绍input和select在table中的嵌套. 理解tabl ...

  2. html table奇偶行颜色设置 (CSS选择器)

    :nth-child(n) 选择器匹配属于其父元素的第 N 个子元素,不论元素的类型.n 可以是数字.关键词或公式. 下面的例子, 设置表格的奇偶行背景颜色不同:单独设置表格的第1列背景颜色不同. & ...

  3. 如何修改antd中表格的表头样式和奇偶行颜色交替

    在做antd表格时通常会用到table组件,但是table的表头时给定的,那么怎么修改表头的颜色呢? 这里用的时less的写法,在全局环境中写,所有的table表头都会变成自己定义的颜色 定义好表头的 ...

  4. Java如何使用while和for嵌套循环控制输出数据,使数据奇偶行不同

    /* 题目1 使用Eclipse编写控制台应用程, 使用while循环在控制台打印10行10列的如下图形 □ □ □ □ □ □ □ □ □ □ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ □ □ □ □ ...

  5. td中嵌套table,让table完全填充父元素td

    <table width="100% " cellspacing=0 cellpadding=0 border=1 > <tr> <td style= ...

  6. Lua中的table构造式(table constructor)

    最简单的构造式就是一个空构造式{},用于创建一个空table. 构造式还可以用于初始化数组.例如,以下语句:days = {"Sunday", "Monday" ...

  7. Java&Selenium处理页面Table以及Table中随机位置的数据

    一.摘要 前一段时间公司小伙伴刚刚接触自动化,遇到的一个问题,页面新创建的数据保存后,出现在table中的某个位置,并不一定是第一行还是第几行,这种情况下如何去操控它 本篇博文将介绍处理这个问题的一种 ...

  8. Bootstrap table插件 被选中的行颜色改变

    参考:https://www.jianshu.com/p/1bb4c37ef636 在 bootstrap-table.min.css 中修改源码 //选中行颜色 .fixed-table-conta ...

  9. Jquery Ajax 异步设置Table中某列的值

    可根据table中某列中的ID去改变某列的值! 只是参考,实际应用中不能这样做的,如果有很多行,频繁访问服务器,服务器是顶不住的! JS: $(document).ready(function () ...

随机推荐

  1. tornado的cookie和secure cookie

    tornado里面有关几个cookie的处理,在web.py文件里. get_cookie, set_cookie普通的设置cookie, clear_cookie, clear_all_cookie ...

  2. MSVC CRT运行库启动代码分析

    原文链接:http://www.programlife.net/msvc-crt-startup.html 在程序进入main/WinMain函数之前,需要先进行C运行库的初始化操作,通过在Visua ...

  3. JS 变量或参数是否有值的判断

    var node; …… 判断 node 是否有值,是否为 undefine,是否 null,直接使用两个!!,否定之否定: if (!!node){ .... }else{ .... } 这个条件判 ...

  4. [shell编程]一个简单的脚本

    首先,为什么要学习shell呢?哈哈,当然不是shell能够怎样怎样然后100字. 最近看到一篇博文<开阔自己的视野,勇敢的接触新知识>,读完反思良久.常常感慨自己所会不多,对新知识又有畏 ...

  5. linux下获取时间差

    #include <sys/time.h> struct timeval tpstart,tpend;     float timeuse;     gettimeofday(&t ...

  6. linux入门教程(三) Linux操作系统的安装

    因为笔者一直都是使用CentOS,所以这次安装系统也是基于CentOS的安装.把光盘插入光驱,设置bios光驱启动.进入光盘的欢迎界面. 其中有两个选项,可以直接按回车,也可以在当前界面下输入 lin ...

  7. 纯互联网项目“失宠”乐博资本杨宁称今后只投O2O

    从去年开始,我们接下来会进入全新的时代,就是智能一切的时代!过去的互联网都在电脑里,都在服务器里,包括现在移动云也是,大数据都是在服务器里面,真正我们身边的东西,智能含量是非常低的.包括你家洗衣机.冰 ...

  8. lintcode 中等题 :Maximum Product Subarray 最大连续乘积子序列

    题目 乘积最大子序列 找出一个序列中乘积最大的连续子序列(至少包含一个数). 样例 比如, 序列 [2,3,-2,4] 中乘积最大的子序列为 [2,3] ,其乘积为6. 解题  法一:直接暴力求解 时 ...

  9. SpringMVC学习总结(六)——SpringMVC文件上传例子(2)

    基本的SpringMVC的搭建在我的上一篇文章里已经写过了,这篇文章主要说明一下使用SpringMVC进行表单上的文件上传以及多个文件同时上传的不同方法 一.配置文件: SpringMVC 用的是 的 ...

  10. pancake sort的几个问题

    1. 每次找剩下序列中的最大值,可以进行pancake sort,时间复杂度是O(n^2): 2. 求最少交换次数进行pancake sort的问题是个NP问题,搜索的时候,upper bound是2 ...