简体   繁体   English

如何根据td为tr添加css属性

[英]how to add css property for a tr depending on td

i want to apply class to tr depending on td cell value in a table . 我想根据表中的td单元格值将类应用于tr。

my html 我的HTML

<table class="k-focusable">
 <tr>
  <th>Name</th>
  <th>Favorite color</th>
<th> status</th>
 </tr>
  <td>James</td>
  <td>red</td>
<td>false</td>
 </tr>
 <tr>
  <td>John</td>
  <td>blue</td>
  <td>true</td>
 </tr>
</table>

var cellIndexMapping = { 2: true };
$("table.k-focusable tbody tr").each(function (rowIndex) {
            $(this).find("td").each(function (cellIndex) {
                if (x[cellIndex]) {
                    var c = $(this).text();
                    if (($.trim(c) == "false") || ($.trim(c) == "null")) {
                        $("table.k-focusable tbody tr").find("td").addClass("hover");
                    }
                }
            });
        });

.hover
{
 font-weight:bold
}

when i am doing this, every row is having this class hover.But i want that class to be add only if the td value is false or null. 当我这样做时,每一行都有这个类悬停。但是我希望仅当td值为false或null时才添加该类。

尝试这个

$("table.k-focusable tbody tr td:contains('false')")

Try this 尝试这个

$("table.k-focusable tbody tr").each(function(rowIndex) {
    var $td = $(this).find("td:eq(2)");
    var c = $td.text();
    if (($.trim(c) == "false") || ($.trim(c) == "null")) {
        $td.closest('tr').addClass("hover");
    }
});​

Check Fiddle 检查小提琴

You don't need the second $.each to iterate over the td's in the first place. 您不需要第二个$.each首先迭代td。 You can then reference the td you want to change with this 然后,您可以以此引用您要更改的td

在您的if (($.trim(c) == "false") ... ,选择所有td ,您只需将类应用于当前单元格,因为您已经在单元格上循环了:

$(this).addClass("hover");

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM