基于单元格值的颜色行 - Jquery答案

【问题标题】：Color row based on cells value - Jquery基于单元格值的颜色行 - Jquery
【发布时间】：2012-08-31 04:17:06
【问题描述】：

我一直在想办法做到这一点。出于某种原因，当我使用“.yellow”选择器时，它返回一个对象，但我无法到达该对象的父对象，一直说它的所有内容都是空的。

我有这个单元格：

<td aria-describedby="CommodityControlReportGrid_ApprovalType" style="text-align:left;" role="gridcell">
    <span class="yellow"></span>
    Ignored
</td>

这些不同单元格的父行都具有以下架构：

<tr class="ui-widget-content jqgrow ui-row-ltr" tabindex="-1" id="101023" role="row"></tr>

基本上，我想根据包含<span class="yellow"></span> 的单元格的行应用该行的背景颜色。

我将如何在 Jquery 中执行此操作，或者至少选择我想要的行（我知道如何应用颜色）？

【问题讨论】：

为什么不将yellow 添加到父级？
我们正在使用服务器端网格框架，它只允许我们修改单元格，而不是它们的父行。

标签： jquery html

【解决方案1】：

您可以只选择黄色类的跨度 - 将它们全部获取..然后应用到相应的 tr

$('span.yellow').closest('tr').css('background-color','yellow');

http://jsfiddle.net/jtY7Q/

【讨论】：

.closest 将遍历它的祖先，直到找到元素或不返回任何内容:).. 就像 parent 一样，只是它不会向上一级停止

【解决方案2】：

请记住，即使您只有一个带有黄色类的跨度，通过非唯一类进行选择也会返回一个数组。确保直接访问一个元素，或者遍历每个返回的项目：

$('span.yellow').each(function(){alert(1);$(this).parents().closest('tr').attr('style','background-color:yellow')});

【讨论】：

【解决方案3】：

看看这个可能有帮助

JsFiddle Demo

   var1 = $("td").children('span').attr('class');
    $("td").css("background-color",var1);

【讨论】：