Javascript 如何获取表中td对应th的Id

我有这样一个场景

<table>
    <thead>
        <tr>
            <th id ="myid1">header1</th>
            <th id ="myid2">headre "2</th>
            <th id ="myid3">header3</th>
        </tr>
    </thead>
        <tr>
            <td>v1</td>
            <td>v2</td>
            <td>v3</td>
        </tr>
        <tr>
            <td>v10</td>
            <td>v11</td>
            <td>v12</td>        
        </tr>
        <tr>
            <td>v20</td>
            <td>v21</td>
            <td>v22</td>                    
        </tr>
        <tr>
            <td>v30</td>
            <td>v31</td>
            <td>v32</td>                    
        </tr>
</table>

---

下面的答案是错误的，但我保留编辑，因为它可能会帮助某人

$('tbody td').live('click', function() {
    var tdIndex = $(this).parent('tr').indexOf($(this));
    var idOfTh = $(this).parent('table').find('tr').eq(tdIndex);
});

未经测试，但理论上应该有效

校正

正如下面Felix Kling指出的那样，上述观点是不正确的。获取索引的正确方法是调用

$（this）.index（）

。我曾假设这会在匹配的选择器中找到

$（this）

的位置（在本例中，是

中的每个

），但实际上，如果传递

index（）

函数时没有参数，它会找到相对于其同级的索引。感谢Felix指出。

您可以使用

eq（）

方法，尝试以下操作：

 $('tbody td').live('click', function() {
     var ind = $(this).index()
     var idOfTh = $('thead th:eq('+ind+')').attr('id')
 });

---

请注意，

live（）

已被弃用。您可以在（）上使用

。
首先，
.live（）
函数已被弃用。如果要委派事件，请使用
.on（）
（jQuery 1.7+）或
.delegate（）
。我将假设您在剩下的部分中使用了
.on（）
，但是如果您必须使用
.delegate（）
，则只有一个小的语法更改（切换前两个参数）

工作区：

只有在动态添加表行时才需要使用live delegation，在这种情况下，您应该使用其他人描述的
.on（）
。
以下是一种方法：

$('td').click(function() {
   var colNum = $(this).parent().children().index($(this)) + 1;
   alert($('#myid' + colNum).text());    
});​

jsiddle:
处理程序可以如下所示：

function() {
    var self = this
    var th_num = 0;

    $(this).parent().children().each(function(num){
        if (this == self) {
            th_num = num;
            return false
        }
    });

    var th_id = $('thead th').eq(th_num).attr('id');
}

这是不对的。获取如下索引：
var tdIndex=$（this）.index（）
。另外，
.parent（'table'）
应该是
。最近的（'table'）
（
.parent（'table'）
不会选择任何元素，因为
td
的父节点不是
表
）和
。find（'tr'）
应该是
。find（'th'）
。谢谢Felix。但是，这不会在匹配的选择器中的所有td元素中得到td的索引，而不仅仅是行吗？不，它会在其同级元素中得到索引：“如果没有参数传递给
.index（）
方法，则返回值是一个整数，指示jQuery对象中第一个元素相对于其同级元素的位置。”（）@ChrisFrancis：我也是这么想的，但看起来费利克斯是对的：那就去修正你的答案吧；）
$(function(){
    $('td').click(function() {
        alert($('table th').eq($(this).index()).attr('id'));
    });
});

$('td').click(function() {
   var colNum = $(this).parent().children().index($(this)) + 1;
   alert($('#myid' + colNum).text());    
});​

function() {
    var self = this
    var th_num = 0;

    $(this).parent().children().each(function(num){
        if (this == self) {
            th_num = num;
            return false
        }
    });

    var th_id = $('thead th').eq(th_num).attr('id');
}