将类添加到包含具有特定值的列的表行

Question

当tr 包含包含某些值的td 时，我需要向它添加一个类。

使用this question on SO 的答案，我以为我找到了解决方案，但它似乎不适用于包含多列的行 - 只有在有一个 td 时才有效。

如何识别包含具有特定值的列以及其他列的表行？请注意，列并不总是按特定顺序排列，因此它必须是动态答案。

The jsFiddle

<table>
    <tr>
        <td>Hey!</td>
        <td>Other column</td>
        <td>Yo!</td>
        <td>Other column2</td>        
    </tr>
</table>

<script type="text/javascript">
$('tr').each(function(){
 if (($(this).find('td').text() == 'Hey!' ) && ($(this).find('td').text() == 'Yo!' ))
 {
     alert('here');
     $(this).addClass('disabled');
 }
});
</script>

Answer 1

正如其他人提到的，使用 jQuery 的 :contains(text) 选择器：

$('tr').each(function(){
   if($('td:contains("Hey!")', this).length && $('td:contains("Yo!")', this).length){       
        alert('here');
        $(this).addClass('disabled');
    }
});

类似的东西。

编辑

更新了我的答案以使用 length 而不是 jQuery 的 size() 函数。向那些张贴证据支持使用length 更快的人表示敬意。在做了我自己的一些基础研究之后，在 jQuery 文档中遇到了这个：

.size() 方法在功能上等同于 .length 属性； 但是，首选 .length 属性，因为它没有 函数调用的开销。

鉴于此，再加上下面的测试用例，我被卖了。想知道为什么size() 甚至存在吗？我的想法是，这是因为 jQuery 返回的某些对象不是数组，而只是 behave 类似数组，并且考虑到使用size() 更可取。看来，至少后者不是这样的。

干杯

Answer 2

怎么样：

$('td:contains("Hey!"),td:contains("Yo!")').parent('tr').addClass('disabled');

?

或者确保两者都存在

$('tr').each(function(){

    if($('td:contains("Hey!")').length > 0 && $('td:contains("Yo!")').length > 0)
        $(this).addClass('disabled');

});

​

Answer 3

使用contains selector

$("td:contains('Hey!'), td:contains('Yo!')").each(function(){
   alert('here');
   $(this).parent().addClass('disabled');
});

Answer 4

这是一种解决方案：

var search = ["Hey!", "Yo!"];

$("tr").filter(function() {
    var found = 0;
    $(this).children().each(function() {
        var text = $(this).text();
        for (var i = 0; i < search.length; i++) {
            if (text == search[i]) found++;
        }
    });
    return found == search.length;
}).addClass("disabled");​

演示： http://jsfiddle.net/Tnq9A/1/

---

如果不需要文字绝对吻合，只需要部分吻合，可以使用这种比较方法：

if (text.indexOf(search[i]) != -1) found++;

演示： http://jsfiddle.net/Tnq9A/2/