2010-08-27 3 views
4

У меня есть сценарий, где я хотел бы, чтобы выбрать строки из таблицы в зависимости от значений в тдJQuery: Как выбрать строки из таблицы

например У меня есть таблица, как этот

<tr> 
    <td>John</td> 
    <td>Smith</td> 
    <td>Male</td> 
</tr> 
<tr> 
    <td>Andy</td> 
    <td>Gates</td> 
    <td>Male</td> 
</tr> 
<tr> 
    <td>Alice</td> 
    <td>Nixon</td> 
    <td>Female</td> 
</tr> 

теперь я хотел бы, чтобы выбрать все строки, если значение первого пДа х И значения второго пДа у

В momemnt я делаю что-то например

$("tr").each(function (index) { 
    if ($(this).find('td:eq(0)').text().trim() == x && 
     $(this).find('td:eq(1)').text().trim() == y) 
      ...do somethin.... 
}); 

цикл через каждый ряд и проверка. Это многословно. Есть ли лучший способ добиться этого в одной строке. Кажется, я не могу понять логику И оператора с селекторами?

В ожидании,

+0

Неполадка: просто напоминание о том, что '.trim()' не будет работать в некоторых браузерах. – user113716

+0

Какая альтернатива тогда? – nabeelfarid

ответ

6
$("tr").each(function (index) { 
    if ($.trim($(this).find('td:eq(0)').text()) == x && 
     $.trim($(this).find('td:eq(1)').text()) == y) { 
     $(this).closest('table').css('border', '1px solid red');​ // this should do it 
    } 
}); 

В качестве альтернативы, используя .filter:

$("tr").filter(function() { 
    return $.trim($(this).find('td:eq(0)').text()) == 'John' && 
      $.trim($(this).find('td:eq(1)').text()) == 'Smith'; 
}).closest('table').find('tr').css('border', '1px solid red');​ 

Демо: http://jsfiddle.net/WhFbE/5/

+1

фильтр подходит хорошо выглядит :) .. так jsfiddle – nabeelfarid

3

Вот селектор, который должен работать:

Попробуйте:http://jsfiddle.net/N6TdM/

var x = "Andy"; 
var y = "Gates"; 

var res = $("td:first-child:contains(" + x + ") + td:contains(" + y + ")"); 

Обратите внимание, что это может потерпеть неудачу, если у вас есть что-то вроде следующего:

FIRST: Roberto  Rob 
SECOND: Robertson  Roberts 

поиска «Роб Робертс» даст два матча.

1

Вы можете использовать native DOM cells property на HTMLTableRowElement, чтобы получить доступ к клеткам непосредственно, а не посылать JQuery на окольную поездку с перечислением всех потомков клетки и выбирая один с нестандартным :eq селектора.

$('tr').each(function (index) { 
    if (
     $(this.cells[0]).text().trim()===x && 
     $(this.cells[1]).text().trim()===y 
    ) { 
     ... 
    } 
}); 

, хотя он, вероятно, не будет иметь серьезных отличий в производительности. Другим подходом было бы просто поддерживать массив массивов, содержащий предварительно обрезанные данные, чтобы сэкономить даже на DOM.

Смежные вопросы