0

我正在开发 ASP.NET MVC 应用程序。它具有使用表格显示每月数据的功能。它根据季度显示，因此它是动态创建的。每个月都显示为
Week -1 Week -2 Week -3 Week -4 像这样。此名称显示在表头部分。
对于每个月显示为不同颜色的背景，我已经实现了显示这些内容。现在它以颜色显示表格标题。我的问题是如何将此背景颜色应用于表格 tds？它应该在coloumnwise中显示。我将使用JQuery。
例如：
如果列标题一为红色，则每列 td 应为背景颜色相同。

编辑：这是 jsfiddle.net/ucfs8/ 我试图插入 jsfiddle 显示错误请转到 jsfiddle 的链接

编辑编辑：解决方案是OKIs有任何方法可以使用CSS来做到这一点，因为JQuery在深入研究应用程序时很慢。实际上这是基于树结构。当您单击节点时，它会向下钻取到子节点。一个节点大约有 10 个子节点。然后花时间使用 JQuery 加载。谢谢。

4

3 回答 3

3

如果您能够找到最感兴趣的专栏，那应该很容易：

$(document).ready(function() {
     var color = $("table>thead th").css("background-color")
     $("table>tbody td").css("background-color", color)
}

您可以使用数字子选择器选择每一列，例如：

for(...length){
   var color = $("table>thead th:nth-child(1)").css("background-color");
   $("table>tbody td:nth-child(1)").css("background-color", color)
}
于 2013-07-26T08:59:58.887 回答
1

如果您自己生成表格，只需向其中添加一个 col 组并设置样式。

类似于（jsFiddle 示例）：

<colgroup>
        <col style="width: 3%; background-color: whitesmoke" />
        <col style="width: 10%; background-color: whitesmoke" />
        <col style="width: 11%; background-color: whitesmoke" />
        <col style="background-color:#ebcccc" />
        <col style="background-color:#ebcccc" />
        <col style="background-color:#ebcccc" />
        <col style="background-color:#ebcccc" />
        <col style="background-color:#dff0d8" />
        <col style="background-color:#dff0d8" />
        <col style="background-color:#dff0d8" />
        <col style="background-color:#dff0d8" />
        <col style="background-color:#dff0d8" />
        <col style="background-color:#d9edf7" />
        <col style="background-color:#d9edf7" />
        <col style="background-color:#d9edf7" />
        <col style="background-color:#d9edf7" />
        <col style="background-color:#d0e9c6" />
        <col style="background-color:#d0e9c6" />
        <col style="background-color:#d0e9c6" />
        <col style="background-color:#d0e9c6" />
        <col style="background-color:#d0e9c6" />
        <col/>
</colgroup>

理想情况下，您会使用一些 css 类：D

于 2013-07-26T09:32:08.057 回答
1

检查这里，更新演示http://jsfiddle.net/yeyene/ucfs8/2/

$(document).ready(function () {
    var col = $('table tr td');
    $('table tbody tr').each(function () {
        $(this).css('background-color','whitesmoke');
        for (var i = 0; i <= col.length; i++) {
            var color = $('table th').eq(i).css('background-color');
            $(this).find('td').eq(i).css('background-color', color);
        }
    });
});
于 2013-07-26T09:06:00.577 回答