0

私は10×8のテーブルを持っています。

すべての行には 8 つの列、つまり 8 つの td 要素があります。行の各 td には異なるクラスがあります。行内の他の td をクリックすると、行内の最初のtd要素の情報を取得できますか?

基本的に、各行の列 2 から列 8 に jquery onclick イベントを作成しています。この列（td）のいずれかをクリックすると、列1のidまたはclassまたはname属性のいずれかの情報が取得されます。サーバー側のコードで送信するには、これが必要です。

- ありがとう。

4

3 に答える 3

2

はい。クリックした要素から、 経由で行に移動すると、またはを使用して関連するクラスで をclosest見つけることができます(おそらく、ネストされたテーブルがある場合)。tdfindchildrenchildren

function clickHandler(e) {
    var cell = $(e.target).closest('tr').children('td.foo');
    // ...
}

または、常に最初 が必要な場合td：

var cell = $(e.target).closest('tr').children('td').first();

そのハンドラーはtd、テーブル内のいずれかに割り当てられている場合tr、または実際にtbodyまたはtable全体として割り当てられている場合に機能します。

実例| ソース

JavaScript:

jQuery(function($) {

  // Put the handler on the tbody
  $("#target").click(clickHandler);

  function clickHandler(e) {
    var td = $(e.target).closest('tr').children('td').first();
    display("The text of the first <code>td</code> in that row is: " + td.text());
  }

  function display(msg) {
    $("<p>").html(String(msg)).appendTo(document.body);
  }

});

HTML:

<table>
  <tbody id="target">
  <tr>
    <td class="one">This is one in row 0</td>
    <td class="two">This is two in row 0</td>
    <td class="three">This is three in row 0</td>
  </tr>
  <tr>
    <td class="one">This is one in row 1</td>
    <td class="two">This is two in row 1</td>
    <td class="three">This is three in row 1</td>
  </tr>
  <tr>
    <td class="one">This is one in row 2</td>
    <td class="two">This is two in row 2</td>
    <td class="three">This is three in row 2</td>
  </tr>
  </tbody>
</table>
于 2012-11-02T08:14:56.663 に答える
1 
$('td').click( function(){
    var $elem = $(this).parent('tr').children('td:first');
    var elem_id = $elem.prop('id'); // or $elem.attr('id');
    .... // for class, name, etc.
});
于 2012-11-02T08:23:34.897 に答える
1

基本的に、次のようなことができます：

$('td.column2-8').click(function()
{
var firstTdData = $(this).parent().children('td:first').html();
});
于 2012-11-02T08:16:05.383 に答える