如何获得表格中单击元素的<tr>

Question

我有一个表格，其中有几个<tr> s，每个表格有几个<td> s。这些列的内容可以是另一个html元素（例如文本框）或只是文本。

我的问题：我如何才能获得此列中一个单击元素的其余兄弟？我的意思是，我怎么能知道哪个<tr>此元素所属，以<tr>＃3＃<tr> 5我没有每一个<tr>指数控制

？例如：

如果我点击的文本框第＃5行中的列＃1，我希望第＃5行中＃2列的内容改变。我不知道该怎么做，因为我的<tr>没有索引。

Answer 1

使用jQuery，将其添加到事件处理程序。这将为您提供表格单元格的集合：

var columns = $(this).closest('tr').children(); 

// .eq() is 0-based, so this would retrieve the fourth column 
columns.eq(3); 

Answer 2

您可以使用index()功能的行的索引。

$('input').click(function(){ 
 
    var index = $(this).parents('tr').index(); 
 
    alert('you click an input on row #' + index); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td><input type="text"></td> 
 
    <td></td> 
 
    </tr> 
 
    <tr> 
 
    <td><input type="text"></td> 
 
    <td></td> 
 
    </tr> 
 
    <tr> 
 
    <td><input type="text"></td> 
 
    <td></td> 
 
    </tr> 
 
</table>

Answer 3

使用closest获取父TR元素。

$('your_element').click(function(){ 
    var tr = $(this).closest('tr'); 
    var element1 = $(tr).find('element_to_find'); 
}); 

Answer 4

您还可以使用：eq运算符来查找td。

$('your_element').click(function() { 
    var tr = $(this).closest('tr'); 
    var col3 = $("td:eq(2)", tr); 
}