Добавить класс в строку таблицы, содержащую столбцы с определенными значениями

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 вместо size() функции JQuery в. Престижность тем, кто опубликовал доказательства в поддержку идеи о том, что использование length происходит быстрее. После того, как я сделал некоторые базовые исследования, наткнулся на это в документах jQuery:

Метод .size() функционально эквивалентен свойству .length; Однако свойство .length является предпочтительным, поскольку оно не имеет служебных данных вызова функции.

Учитывая, что плюс тестовый пример ниже, я продан. Интересно, почему size() существует? Я думал, что это связано с тем, что некоторые объекты, возвращаемые jQuery, не являются массивами, но только ведут себя как, как массивы, и что при условии, что использование 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");​ 

DEMO:http://jsfiddle.net/Tnq9A/1/

---

Если вам не абсолютное совпадение текстов, но частичное, вы можете использовать это сравнение метод:

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

DEMO:http://jsfiddle.net/Tnq9A/2/