突出显示一列

时间:2010-10-19 20:21:33

标签: jquery

我在其中一个jQuery书中看到,你可以突出显示正在排序的列。

$('th.sortable').click(function() {
    var $th = $(this);
    var column = $th.index();
    var $table = $th.closest('table');
    var rows = $table.find('tr:not(:has(th))').get();

问:如何将'hightlight'类添加到单击列中的每个单元格?

2 个答案:

答案 0 :(得分:5)

在这种情况下,您可以使用nth-child选择器。

$('th.sortable').click(function() {
    var $th = $(this),
        column = $th.index(),
        $table = $th.closest('table');

    $table.find('tr td:nth-child(' + (column+1) + ')').addClass('highlight');
});

答案 1 :(得分:3)

我认为你可以做这样的事情:

示例: http://jsfiddle.net/4Sg8E/

$('th.sortable').click(function() {
    var $th = $(this);
    $th.closest('table').find('td:nth-child(' + ($th.index() + 1) + ')')
        .css('background','yellow');
});

它会获得与点击的<td>位置相同的所有<th>个元素,并使它们变暗。