4

ユーザーがテーブルの任意の列を選択でき、jQueryでそれを可能にすることは可能ですか？

ここに再生する例があります：http：//jsbin.com/oluyex/1/edit

jQUERY。それぞれの子を選択する方法がわかりません：

$(function(){
    $("th").click(function(){
        $(this).("children").css("background-color","red"); 
    });
})

HTML：

<table id="taula" border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
4

3 に答える 3

4

これを行うには、テーブル ヘッダーのインデックスを取得し、そのインデックスを使用して列内の各テーブル セルにクラスを適用するだけです。適切なテーブル セルを見つけるには、各行をループする必要があります。- http://jsfiddle.net/BMGKv/

$('th').click(function() {
    var th_index = $(this).index();
    $('tr').each(function() {
        $(this).find('td').eq(th_index).toggleClass('highlight');
    });
});
于 2012-12-21T18:04:21.960 に答える
2

これを試して：

$(function(){
    $("th").click(function(){
      var idx = $(this).index()+1;
      $(this).parent().siblings().find("td").css("background-color","white");
      $(this).parent().siblings().find("td:nth-child("+idx+")").css("background-color","red");  
    });
})

ここでテスト

于 2012-12-21T18:05:11.403 に答える