4

我有一个问题要突出显示由 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">

Row 没有改变他们的背景颜色,我不知道为什么。用 Firefox 和 Chrome 测试。

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

马里奥

4

3 回答 3

2

为 <tr> 设置背景并不总是可靠的,您最好为所有子 <td> 或 <th> 设置它。

一个很好的方法是替换你的

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

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

然后添加css

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

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

于 2012-09-12T10:42:17.510 回答
2

试试这个 JS 代码(jsFiddle)。为我工作

$('tr td[headers="IDZ"]').each(function(){
  if(parseInt($(this).html()) == 12){
    $(this).parent().css('background-color','red');
  }
});​
于 2012-09-12T10:45:43.993 回答
0

你也可以使用.closest('tr')和我用过text的来代替html

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

演示

于 2012-09-12T10:51:31.873 回答