jQuery: как выбрать последние N столбцов каждой строки в таблице? - PullRequest
5 голосов
/ 30 апреля 2011

У меня есть таблица с 6 столбцами.Я хочу запустить функцию на последних 3 столбцах каждой строки (исключая строку заголовка).У меня есть следующий селектор, который работает:

$('table.listviewtable > tbody > tr:gt(0)').find('td:gt(2)')
    .each(function () { runMyFunction($(this)); });

Есть ли способ сделать все это в одном селекторе (т.е. без промежуточного find)?:

Я пробовал

$('table.listviewtable > tbody > tr:gt(0) td:gt(2)')

и

$('table.listviewtable > tbody > tr:gt(0) > td:gt(2)')

, но они не работали.Они вернули 4-й, 5-й и 6-й столбцы 2-го ряда и все столбцы всех последующих строк.

Ответы [ 5 ]

8 голосов
/ 30 апреля 2011

Вот, пожалуйста:

$('table.listviewtable td:nth-child(n+4)')

Живая демоверсия: http://jsfiddle.net/simevidas/qJ3tP/1/

(я предполагаю, что вы используете элементы TH для ячеек заголовка.)

6 голосов
/ 25 августа 2012

Правило

Общее правило для получения X последнего TD ТР:

$('#tbl tr td:nth-last-child(-n+X)');

Пример

// Example for the last 3 paragraphs in some section:
$('#my_section p:nth-last-child(-n+3)');

// It's exactly the same as:
$('#my_section p:nth-last-child(3-n)');

Демо

<!-- CSS -->
<style>
  td {
    border: solid 1px #999;
    padding: 2px;
  }
</style>

<!-- HTML -->
<p>Last 3 cells made gray using jQuery</p>
<table>
  <tr>
    <td>One</td>
    <td>Two</td>
    <td>Three</td>
    <td>Four</td>
  </tr>
</table>

<!-- JavaScript -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
  $(document).ready(function() {
    $('table tr td:nth-last-child(-n+3)').css('background', '#CCC');
  });
</script>

Спасибо

http://css -tricks.com / Полезные-nth-child -ополучатели /

1 голос
/ 30 апреля 2011
$('table.listviewtable > tbody > tr td:gt(2)')
0 голосов
/ 30 апреля 2011

как насчет

$('td:gt(2)', 'table.litviewtable')

конечно, если вы используете th в заголовке.

0 голосов
/ 30 апреля 2011

Самый простой и очевидный селектор:

$('tr').each(
function(){
    $(this).find('td:gt(2)').css('background-color','#ffa');
});

JS Fiddle .

Отредактировано , потому что я идиот и упустил из виду очевидный недостаток в первом предложении. Кстати, я предполагаю правильную разметку, используя th для строк заголовка. Однако вы можете изменить селектор на:

 $('tbody tr')

Чтобы обойти это, если вы не используете th элементы.

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