使用jQuery根据表中`td`的值隐藏`tr`答案

【问题标题】：Hide a `tr` based on the values of `td` in the table using jQuery使用jQuery根据表中`td`的值隐藏`tr`
【发布时间】：2012-11-05 13:15:15
【问题描述】：

我有一个表格，其中填充了来自后端数据库的查询的动态内容。我想隐藏任何只包含零的tr。

这是我的桌子的样子：

<table id="table1" " cellspacing="0" style="width: 800px">
<thead id="tablehead">
</thead>
<tbody id="tabledata">
<tr class="odd">
<td>0</td>
<td>0</td>
<td>0</td>
<td>0.00%</td>
<td>0.00%</td>
<td>$0.00</td>
<td>$0.00</td>
<td>$0.00</td>
<td>$0.00</td>
<td>$0.00</td>
<td>$0.00</td>
</tr>
</tbody>

现在如果tbody 中的前三个td 是== 0，那么我想向tr 添加一个类，它可以有效地隐藏该行。我将如何使用 jQuery 来做这件事？

编辑： 抱歉忘记添加我尝试过的内容。下面是一个测试脚本，我试着看看能不能收集到所有td的

$(document).ready(function() {
    $("#table1 td").filter(function() {
        return $(this).text == 0;
    }).css("text-color", "red");

    });

【问题讨论】：

添加了我尝试过的内容。抱歉忘记放了。
什么是.css("text-color"？
@Ian 我只是想看看filter 函数是否会选择正确的td's
@NicYoung 是的，但text-color 不是一种风格。我想你的意思是color？
在你的代码中，你会想要使用.text()，而不是.text...并且可能与"0"而不是0进行比较，尽管我猜比较会仍然可以使用，因为您使用的是==

标签： javascript jquery html

【解决方案1】：

你可以这样做：

$('tr').each(function(){
    var tr = $(this);
    if (tr.find('td:eq(0)').text()=="0"
        && tr.find('td:eq(1)').text()=="0"
        && tr.find('td:eq(2)').text()=="0"
    ) tr.addClass('hidden');
});

Demonstration（隐藏类将颜色变为红色，更清晰...）

根据您的需要，您可能需要trim 文本，或parse 它们。

对于更复杂的测试，您可能会发现直接使用单元格内容数组很有用。您可以使用

var celltexts = tr.find('td').map(function(){return $(this).text()}).toArray();

【讨论】：

这正是我所需要的，非常感谢！