如何通过javascript/jquery获取单元格中的元素行？

Question

我有一个像这样的简单表

<table id="tempTable">
    <tbody>
        <tr id="row_01">
            <td>
                <button onclick="btnclick(this);" >Save Row</button>
            </td>
        </tr>
        <tr id="row_02">
            <td>
                <button onclick="btnclick(this);" >Save Row</button>
            </td>
        </tr>
    </tbody>
</table>

function btnclick(e) {
    var currentRow = $(e).parent().parent();
    alert(currentRow.id);
}

我想确定点击按钮的位置.所以我在btnclick()中使用了一些jquery方法,就像你看到的那样.但有时候我不知道按钮放在row()中的深度有多深,所以我正在寻找一种通过<tr>元素标记来获取祖先的方法.

有人帮帮我,谢谢？

Answer 1

试试这个 :

function btnclick(e) {
    var currentRow = $(e).closest('tr');
    alert(currentRow.id);
}

该closest()函数将返回其选择器引用的最近的祖先.在这种情况下,选择器是一个简单的<tr>元素.

取自jQuery文档:

.closest(选择器)

获取与选择器匹配的第一个元素,从当前元素开始并逐步向上遍历DOM树.

更好的方法可以,如果你改变你的HTML一点点使用.如果您在每个按钮上放置相同的类.
例如:

<td>
  <button class="myBtnClass" >Save Row</button>
</td>

然后你的jQuery看起来像这样:

$(".myBtnClass").on('click',function(){
    var currentRow = $(this).closest('tr');
    alert(currentRow.attr('id'));
});

此函数将捕获对该类的任何元素的单击.myBtnClass.