jquery - 给定一个特定的 td，使用 Jquery 从同一列的顶行获取 td 值

Question

标题说明了一切。我有一个表格，它是顶部 tr 的日期列表。单击特定的 td，我希望能够使用 Jquery 从同一列的顶行获取 td 值。

例如：

<table>
  <tr>
     <td>Jan 1</td>
     <td>Jan 2</td>
     <td>Jan 3</td>
  </tr>
  <tr>
     <td>col 1, row 1</td>
     <td>col 2, row 1</td>
     <td>col 3, row 1</td>
  </tr>
  <tr>
     <td>col 1, row 2</td>
     <td>col 2, row 2</td>
     <td>col 3, row 2</td>
  </tr>
  <tr>
     <td>col 1, row 3</td>
     <td>col 2, row 3</td>
     <td>col 3, row 3</td>
  </tr>

如果我单击 col 1 中的任何 td，我想返回值“Jan 1”

如果我单击 col 2 中的任何 td，我想返回值“Jan 2”

如果我单击 col 3 中的任何 td，我想返回值“Jan 3”

说得通？

目前，我只希望空 td 发生这种情况，所以这是我的 jQuery 的开始。

$("table td:empty").dblclick(function(){

  $(TD VALUE FROM TOP OF SAME COLUMN).text();

});

Answer 1

我建议：

$('td').click(function(){
    var index = this.cellIndex;
    console.log($('tr').first().find('td').eq(index).text());
});

JS 小提琴演示。

Answer 2

这可以index在选择trs 时通过函数和一些过滤的组合来完成：

$("table tr").not(":first").on("click", "td", function () {
    var $tr = $(this).parents("table").find("tr:first"),
        idx = $(this).index() + 1,
        srch = "td:nth-child(" + idx + ")",
        txt = $tr.find(srch).text();
});

工作文件在这里。