javascript - jQuery:确定从哪个 调用该函数

Question

我有一个看起来像这样的 knockout 网格(没什么特别的):

当我单击“编辑”时，它必须确定在哪个 <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 父级。

如果 tr 元素不是彼此的同级: 将该对象传递给 tr 集合上的方法 .index():

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

如果 tr 元素是彼此的兄弟元素:

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