zoukankan      html  css  js  c++  java
  • 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

  • 相关阅读:
    ↗☻【精彩绝伦的CSS#BOOK#】
    Adding client to server's list failed, CORBA error: IDL:omg.org/CORBA/COMM_FAILURE:1.0
    hadoop文件输出控制,多路径输出到不同文件
    virtualbox安装CentOS无法上网
    ant如何使用——初学者一篇通
    linux下用户命令
    hadoop启动后进safemode不出来
    hadoop获取context的当前输出路径,
    hadoop输出控制,输出到指定文件中
    python option.parser
  • 原文地址:https://www.cnblogs.com/wanliyuan/p/3643639.html
Copyright © 2011-2022 走看看