突出顯示一列

Question

我在其中一本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'類添加到單擊的列中的每個單元格？

Answer 1

有一個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'); 
}); 

Answer 2

我想你可以做這樣的事情：

例子：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>，並點亮它們。