jquery - Add class to a table row that contains columns with certain values

Question

I need to add a class to a tr when it contains td's that contain certain values.

Using the answer to this question on SO, I thought I found the solution, but it doesn't seem to work on rows that contains multiple columns - it only works if there is a single td.

How can I identify the table rows that contain columns with certain values, among other columns? Please note that the columns will not always be in certain order, so it must be a dynamic answer.

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

关于什么：

$('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');

});

​</p>

Answer 2

正如其他人所提到的，使用 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 返回的某些对象不是数组，而只是表现得像数组，并且考虑到 usingsize()更可取。似乎后者，至少，不是这样。

干杯

Answer 3

使用包含选择器

$("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/