jQuery：确定从哪个函数调用

Question

我有一个看起来像这样的淘汰网格（没什么特别的）：

单击“编辑”时，必须确定调用的<tr>。例如，我在第一个用户上单击编辑，它必须登录控制台“1”，依此类推。

我的表格代码：

<table class="table table-striped table-bordered table-condensed" data-bind='visible: users().length > 0'>
    <thead>
        <tr>
            <th>UserId</th>
            <th>Username</th>
            <th>FirstName</th>
            <th>LastName</th>
            <th>Email</th>
            <th>Date</th>
            <th />
        </tr>
    </thead>
    <tbody data-bind='foreach: users'>
        <tr>
            <td>
                <label data-bind="text: UserId" />
            </td>
            <td>
                <input data-bind='value: Username' />
                <label data-bind="text: Username" />
            </td>
            <td>
                <input data-bind='value: FirstName' />
                <label data-bind="text: FirstName" />
            </td>
            <td>
                <input data-bind='value: LastName' />
                <label data-bind="text: LastName" />
            </td>
            <td>
                <input data-bind='value: Email' />
                <label data-bind="text: Email" />
            </td>
            <td>
                <input data-bind='value: Date' />
                <label data-bind="text: Date" />
            </td>
            <td class="tools">
                <a class="Apply" href="#" data-bind="click: $root.applyUser">Apply</a>
                <a class="Edit" href="#" data-bind="click: $root.editUser">Edit</a>
                <a class="Update" href="#" data-bind='click: $root.updateUser'>Update</a>
                <a class="Delete" href='#' data-bind='click: $root.removeUser'>Delete</a>
            </td>
        </tr>
    </tbody>
</table>

这是我的尝试：

$('a.Edit').click(function () {
                    var rowIndex = $(this).parent()
                                          .parent()
                                          .children()
                                          .index($(this).parent());
                    console.log('Row: ' + rowIndex);
                });

我错过了什么？

Answer 1

您可以使用.closest()来遍历最近的tr父级。

IF tr元素不是彼此的兄弟：将该对象传递给tr集合上的方法.index()：

 $('tr').index($(this).closest('tr'));

IF tr元素是彼此的兄弟姐妹：

 $(this).closest("tr").index()

Answer 2

我会这样做如下 -

通过将课程提供给父级tr -

<tr class="parent">

然后 -

$(this).closest('tr.parent').index()

因为如果案例是嵌套的tr(s)，那么parent()将不会工作更长时间。