Question

我在突出显示由apex生成的表格中的某些行时遇到了问题。

通过动态操作和jQuery，我能够突出显示单个列

jQuery的：

$('tr td[headers="IDZ"]').each(function(){
  if(parseInt($(this).html()) == 12){
    $(this).attr('style','background-color:red');
  }
});

结果是html：

<td align="right" headers="IDZ" style="background-color:red">12</td>

工作正常，IDZ == 12的列现在为红色。

但我想强调整行，所以我想让我们得到父节点<tr>并添加一些“样式”。

jQuery的：

$('tr td[headers="IDZ"]').each(function(){
  if(parseInt($(this).html()) == 12){
    $(this).parent().attr('style','background-color:red');
  }
});

结果：

<tr class="even" style="background-color:red">

行没有改变他们的背景颜色，我不明白为什么。使用Firefox和Chrome进行测试。

我很感激任何提示或解决方案。

马里奥

Answer 1

为＆lt; tr＆gt;设置背景并不总是可靠地工作，你最好为所有孩子设置它＆lt; td＆gt;或者＆lt; th＆gt; s。

这样做的好方法是更换

$(this).parent().attr('style','background-color:red');

与

$(this).parent().addClass('highlightit');

然后添加css

tr.highlightit td { background-color: red; }

将使该表行下的所有表数据元素都具有红色背景。

Answer 2

尝试使用此JS代码（jsFiddle）。为我工作

$('tr td[headers="IDZ"]').each(function(){
  if(parseInt($(this).html()) == 12){
    $(this).parent().css('background-color','red');
  }
});

Answer 3

您也可以使用.closest('tr')我使用text代替html

$('tr td[headers="IDZ"]').each(function(){
    if(parseInt($(this).text()) == 12){
        $(this).closest('tr').attr('style','background-color:red');
    }
});

DEMO

为什么背景颜色不变？

3 个答案: