14

ヘッダーの ID と行の ID を設定した単純なテーブルがあります。両方の ID が与えられた場合、これら 2 つの交点で対応するセルを見つける必要があります。

例：

<table id="tablica">
    <thead>
        <th id="bla">Bla</th>
        <th id="bli">Bli</th>
        <th id="blu">Blu</th>
    </thead>
    <tbody>
        <tr id="jedan">
            <td>1</td>            
            <td>2</td>
            <td>3</td>
        </tr>
        <tr id="dva">
            <td>4</td>            
            <td>5</td>
            <td>6</td>
        </tr>
        <tr id="tri">
            <td>7</td>            
            <td>8</td>
            <td>9</td>
        </tr>
    </tbody>
</table>​​​

したがって、id="bli" と id="dva" がある場合、この例では値が 5 のセルで何かをしたいということです。

編集：正解はたくさんあります。私はそれらすべてに賛成票を投じましたが、残念ながら正解として選択できるのは1つだけです。

4

4 に答える 4

13

これが私の解決策です：

var column = $('#bli').index();
var cell = $('#dva').find('td').eq(column);

jsfiddle での作業例: http://jsfiddle.net/t8nWf/2/

すべてを関数に追加しました:

function getCell(column, row) {
    var column = $('#' + column).index();
    var row = $('#' + row)
    return row.find('td').eq(column);
}

作業例: http://jsfiddle.net/t8nWf/5/

于 2012-04-23T09:47:58.177 に答える
3

行のIDを取得している場合は、データ5を含む列を選択できます。

$("#dva").find("td:contains(5)").css({"background-color":"red"});

また、このフィドルを実際の例として参照してください。

EDIT 行のIDを知らなくても、テーブルにIDしかない場合は、セルを見つけることもできます：

$("#tablica tr").find("td:contains(5)").css({"background-color":"red", "padding":"5px"});

実施例

于 2012-04-23T09:34:43.657 に答える
2 
$('#dva > td').eq($('#bli').index()); // returns the td element

動作するはずです。作業例: http://jsbin.com/acevon/edit#javascript,html,live

于 2012-04-23T09:39:10.500 に答える
1

これにより、必要な TD 要素が jQuery オブジェクトとして取得されます。

var thIndex = $( '#tablica #bli' ).index (); // get index of TH in thead
var $td = $( $( '#dva td' ).get ( thIndex ) ); // get the TD in the target TR on the same index as is in the thead

JSFiddle の例

于 2012-04-23T09:39:46.867 に答える