javascript - 返回表格行的元素

Question

如果我点击 中的任何一个，我想返回行 () 中的内容。

<table id="dataTable" class="table table-hover">
    <thead>
        <tr>
            <th>ID</th>
            <th>Nome</th>
            <th>Email</th>
            <th>Empresa</th>
            <th>Criado</th>
            <th>Ações</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td id="id-cliente-14">14</td>
            <td>Name here</td>
            <td>contato@test.com</td>
            <td>sdfsf</td>
            <td>2017-03-13 11:31:58</td>
            <td>
                <a href="" class="actions_icons pencil"><i class="fa fa-pencil" aria-hidden="true"></i></a>                             
                <a href="" class="actions_icons trash"><i class="fa fa-trash" aria-hidden="true"></i></a>
            </td>
        </tr>
    </tbody>
</table>

使用这段代码:

    $("i.fa.fa-pencil").on( "click", function() {
        console.log( $(this).parent().parent().parent().text() );
    });

我在控制台上得到了这个结果:

14Name herecontato@test.comsdfsf2017-03-13 11:31:58

我不能用这个，我需要单独获取 ID，如果这不难的话，也可以单独获取所有其他 ID。

我可以将 css class 或和 id 放在 或另一个标签中，如果这样可以更容易的话。

Answer 1

您当前选择的是<tbody>因为它是 parent 的 parent 的 parent 。如果你想要第一个 <td>您可以选择 parent 的第一个 sibling 或祖 parent 的第一个 child ，例如:

$("i.fa.fa-pencil").on( "click", function() {
    console.log( $(this).closest("tr").children(":first").text() );
});