javascript - jQuery 获取触发事件的行并更新表中的特定 td

Question

我正在 try catch 表中触发事件的行的索引，如下所示:

<tr>
 <td class="sorting_1" style="text-align:left;" width="10%">
 <a  class="btnWatchList" value="1"><i class="fa fa-edit"></i></a>
 <a class="deleteBulkItem" value="2"><i class="fa fa-trash"></i></a>
 </td>
</tr>

我做了这样的事情:

$("#datatable-responsive").delegate("tr", "click", function (e) {
    var index = $(e.currentTarget).index(); // finding the column index

    console.log($(e.currentTarget).index());
    $('#datatable-responsive tr:eq('+index+') td:eq(2)').text('ChangedText'); // changing the text

});

因此，这是棘手的部分，我不希望仅在任何 TR 单击时触发事件，而只是在 TR 中的特定按钮(即元素)上触发:

 <a  class="btnEdit" value="1"><i class="fa fa-edit"></i></a>

然后，当我捕获触发事件的行的索引时，然后更新该行的特定列，其 HTML 标记如下所示:

 <td class="sorting_1" width="60%">
 <h5 ><b><a href="Title1Link" id="titleText" value="Titl1" id="linkText" target="_blank">Title1</a></b></h5>
 <h6><b><a href="Title2Link" id="" target="_blank">Title2</a></b></h6>
 </td>

现在，一旦我找到触发事件的列的索引，我想将第一个链接的文本设置为“Clicked”或类似的内容，这样我就知道它确实有效...

总结一下我在这里想要实现的目标:

• 获取触发 onclick 事件的行索引(仅在 btnEdit 点击时，而不是任何 tr 点击时)

• 首先将链接的文本更新为“已点击”

有人可以帮我吗？

Answer 1

定位按钮并使用 closest() 向上遍历到行。根据显示的代码，您似乎甚至不需要索引，只需要行对象

$("#datatable-responsive").delegate("tr .btnEdit", "click", function (e) {
     var $row = $(this).closest('tr');       
     $row.find('td:eq(2)').text('ChangedText'); // changing the text    
});

请注意，delegate() 已弃用，如果您使用的 jQuery 版本高于 1.7，则应使用 on() 代替