16

複数行、複数列のテーブルがある場合、任意のセル (たとえば、クリックされたセル)と同じ列のすべてのセルを選択するにはどうすればよいですか。

何かのようなもの：

$("td").click(function(){
    var columnNo = $(this).columnNo?
    $(this).closest("table").find("tr td:eq("+columnNo+")").css("color", "red");
});

列に個別に名前を付けずにこれを行う必要があります。たとえば、table追加のクラスや ID がなくても、単純な汎用マークアップで動作するはずです。

4

2 に答える 2

24

あなたの試みは正しいです。必要なのは、 を使用して列番号 (行内.indexのインデックス) を見つけることだけです。また、 nth-child-selectorを使用して、他の要素の列インデックスを一致させる<td>必要があります。<td>

$("td").click(function(){
    var columnNo = $(this).index();
    $(this).closest("table")
        .find("tr td:nth-child(" + (columnNo+1) + ")")
        .css("color", "red");
});
于 2012-12-27T20:58:01.450 に答える
4

eqこれは、jQueryメソッドを使用して実行できます。

var $tds = $("td"); // get all tds beforehand, so jquery doesn't 
                    // need to hit the DOM every click

$("td").on("click", function () {
    var position = $(this).index(),
        $tdsInColumn = $tds.filter(":nth-child(" + index + ")");

    // manipulate $tdsInColumn in any way
    $tdsInColumn.addClass("selected");
});

これが最も効率的な方法かどうかはわかりませんが、しばらく前に同じ問題に直面したときに思いついた解決策です。

参照

jQuery.eq

于 2012-12-27T20:53:31.827 に答える