Question

在我的文档中的一些<tr>内有7个类，每个类有时都有相应的类名（即sub，id，assign，sub，sub，status和one classless“td” ）。在td class =“status”中有一个span类定义为 <span class = "statusBox">Passed</span> 要么 <span class = "statusBox">Failed</span>.

如果span类中包含的文本是“Passed”，我需要删除整个<tr>。如果失败则会留在文档上。我怎样才能做到这一点？

我的第一次尝试是通过如下呼叫：

function() {
    if ($('tr td span.statusBox').html() == "Passed"){
    $('tr td span.statusBox').hide();  
}

但这删除了只有短语“Passed”的每个实例，而不是整个<tr>。

我也试过了 $("tr td span.statusBox:contains('Passed')").each(function(){ $(this).css("visibility","hidden"); });

我觉得这更像是在正确的道路上，但我似乎无法让它发挥作用。

Answer 1

你很接近：找到带有'Passed'字样的状态框，然后找到最近的祖先tr元素并将其从DOM中删除：

$("tr td span.statusBox").filter(":contains('Passed')").each(function(){
    $(this).closest('tr').remove();
});

由于:contains运算符是jQuery扩展（已从CSS规范中弃用），因此将选择器分为两部分会更快。第一个是查找类statusBox的所有跨度，这将使用本机浏览器方法查找元素。然后使用:contains运算符（可能具有本机实现或可以在jQuery中实现，具体取决于浏览器）过滤这些元素。

Answer 2

这是因为您正在改变跨度而不是父<tr>的可见性。您可以使用$(this).closest('tr')访问row元素，然后更改其可见性。

$("tr td span.statusBox:contains('Passed')").each(function(){
    $(this).closest('tr').css("visibility","hidden"); 
});

Answer 3

$(".statusBox").each(function (i, e) {
    if ($(e).text() == "Passed") {
        $(e).closest('tr').hide();
    }
});

http://jsfiddle.net/B7Wqy/

如何在特定td中包含关键字时删除整个tr

3 个答案: