javascript - 使用jQuery根据表中 `tr`的值隐藏一个 `td`

Question

我有一个表格，其中填充了来自后端数据库的查询的动态内容。我想隐藏任何仅包含零的 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");

    });

Answer 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();