parent() 和最接近的() 如何在 jQuery 中工作？答案

【问题标题】：How parent() and closest() work in jQuery?parent() 和最接近的() 如何在 jQuery 中工作？
【发布时间】：2016-07-07 07:15:30
【问题描述】：

当点击后者时，我只想在另一个row 之后添加一个row 表，所以我使用了以下代码（实际上我在visualforce页面中使用此代码）。

function queryAndUpdateLead() { 
        var a = $('[id$=ibrahim]').closest('tr')
                .after('<tr><td>New Content 1</td><td>\
                        <a href="#">New Content 2</a></td></tr>');
}

这里的问题是这一行是在表中所有现有行之后添加的，当我使用length 属性检查a 中的元素数时，我总是得到 2（我最初有 2 行）

alert('a.length') // this shows 2

我想要的是仅直接父行而不是所有现有行，但我不知道为什么它不起作用？

编辑：销售人员服务器呈现的 HTML 代码：

<tbody id="j_id0:j_id3:j_id4:j_id6:tb">
<tr class="dataRow even first" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}" onmouseout="if (window.hiOff){hiOff(this);} " onmouseover="if (window.hiOn){hiOn(this);} ">
**<td id="j_id0:j_id3:j_id4:j_id6:0:ibrahim" class="dataCell " onclick="queryAndUpdateLead();" colspan="1">**
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id7" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id8" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id9" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:0:j_id10" class="dataCell " colspan="1">
</tr>
<tr class="dataRow odd last" onfocus="if (window.hiOn){hiOn(this);}" onblur="if (window.hiOff){hiOff(this);}" onmouseout="if (window.hiOff){hiOff(this);} " onmouseover="if (window.hiOn){hiOn(this);} ">
<td id="j_id0:j_id3:j_id4:j_id6:1:ibrahim" class="dataCell " onclick="queryAndUpdateLead();" colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id7" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id8" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id9" class="dataCell " colspan="1">
<td id="j_id0:j_id3:j_id4:j_id6:1:j_id10" class="dataCell " colspan="1">
</tr>
</tbody>
</table>

【问题讨论】：

所有行的 id 都以“ibrahim”结尾吗？因为那是你使用的选择器。
不，只有一行名为易卜拉欣
那么请出示您的HTML；和足够的 jQuery 来重现你的问题，否则我们只能玩猜谜游戏。
是的，但是 html 代码很长，只要它是由 Salesforce 服务器呈现的
我更新了问题

标签： jquery html-table append rows

【解决方案1】：

由于您有$('[id$=ibrahim]') 元素的集合，您需要使用$(this) 找到与当前单击的元素最近的tr 并在之后插入该内容：

function queryAndUpdateLead() { 
        var $(this).closest('tr')
                .after('<tr><td>New Content 1</td><td>\
                        <a href="#">New Content 2</a></td></tr>');
}

【讨论】：