使用jQuery获取列中的第一个表格单元值

Question

我有一个包含一些值的表格。第一行和第一列分别包含所谓的垂直和水平尺寸的值。我需要做的是点击一个表格单元格并获取该单击表格单元格的水平和垂直值。它的基本含义 - 获取单击表格单元格所在行中第一个表格单元格的值，并获取单击表格单元格所在列的第一个表格单元格值。我得到以下代码的水平值：

var horizSize = $('th:first', $(this).parents('tr')).text(); 

但我不知道如何做到这一点的垂直线。如何获得列的第一个表格单元格值？

感谢您的帮助。

Answer 1

我认为下面应该工作：

var verticSize = $('tr:first td').eq($(this).index()).text(); 

JS Fiddle demo。

注意，在演示中，我也已经修改你的horizSize选择，到：

horizSize = $(this).closest('tr').find('td:first').text(); 

并随后细化到：

horizSize = $(this).prevAll('td:last').text(); 

上述假设您想要的单元格的值来自:firsttr元素，无论是在thead还是tbody。如果您已将标题单元格标记为th，则需要将选择器的td修改为th。

---

响应费利克斯·克林的评论编辑：

相反的$('tr:first td')，$(this).closest('table').find('tr:first td')可能会更好（这取决于其他标记）。

这是我应该想到的，我自己，真的。而且，如果有一个以上的table在文档中，然后这种改变将是至关重要的，以证明：

var verticSize = $(this).closest('table').find('tr:first td').eq($(this).index()).text(); 

JS Fiddle demo。

参考文献：

• closest()。
• eq()。
• find()。
• :first selector。
• index()。
• :last selector。
• prevAll()。

Answer 2

可以导航到合适的细胞与指数：

$('table tr:gt(0)').each(function() { 

    var $valRow = $('table tr:eq(0)'); 

    $(this).find('td:gt(0)').css({ background: "red" }).click(function() { 

     var x = $valRow.find('td:eq(' + $(this).index() + ')').text(); // top row 
     var y = $(this).closest('tr').find('td:eq(0)').text(); // first cell of your row will be your first column cell 

     alert('x=' + x + '; y=' + y); 
    });; 
}); 

代码：http://jsfiddle.net/uKhwq/1/