通过行单击事件传递动态创建的 html 表行内文 ID答案

【问题标题】：Pass dynamically created html table row innertext id via row click event通过行单击事件传递动态创建的 html 表行内文 ID
【发布时间】：2020-05-16 13:10:54
【问题描述】：

我有一个动态创建的htmltable。我已使行可点击。我需要将行内文本 id 传递给单击该行时触发的脚本。

htmltable:

<table style="width:100%;">
     <tr>
        <th>id</th>
        <th>name</th>
        <th>other info</th>
     </tr>
    <tr>
         <td class='table_row_click'>11</td>
        <td class='table_row_click'>item 2</td>
        <td class='table_row_click'>lmfao</td>
    </tr>
    <tr>
        <td class='table_row_click'>22</td>
        <td class='table_row_click'>item 2</td>
        <td class='table_row_click'>lol</td>
    </tr>
</table>

点击事件：

$(document).ready(function ($) {
           $(".table_row_click").click(function (e) {

//I need to use the clicked row ID here for something 

            });
       });

【问题讨论】：

您的行没有 ID？如果你在 td 的 innerText 之后，那就是 e.target.innerText
是的，我很抱歉。我需要内部文本 id，在本例中，如果我单击第一行，我将需要 id“11”。
看起来它会起作用，谢谢。我现在就试试。
实际上，我将如何用 td 指定我想要的内部文本？因为我可以单击该行上的任何 td 来触发事件
e 是通过单击特定元素生成的事件。 e.target 是事件起源的元素。

标签： javascript jquery asp.net html-table click

【解决方案1】：

$(e.target).closest('tr').find('td').first().text();

您可以向上导航到父 tr，找到 td 元素，获取第一个元素，然后获取其文本。

如果类处于 td 或 tr 级别，则使用 closest('tr') 将起作用，因为 closest() 可以匹配自身。

【讨论】：

完美伴侣。非常感谢