单击 iframe 中的链接，然后执行 jQuery 操作 [重复]

Posted 2023-02-27

【中文标题】单击 iframe 中的链接，然后执行 jQuery 操作 [重复]

【英文标题】：Click on link in iframe then perform jQuery action [duplicate]

【发布时间】：2014-01-21 11:21:11

【问题描述】：

我有这个带有 iframe 的索引页面。在 iframe 中，我有一些链接，例如：

<a href="home.html" target="content">Who we are</a>

当我单击此链接时，我想执行一个 jQuery 操作，例如使用此代码在索引页面上滑动一个 div。

$(window).load(function () 
$(".link_in_Iframe").click(function()
$('.sliding_div_on_index_page').animate('top': '-190px', 1000);
); 

我知道不可能将点击功能添加/绑定到 iframe 本身，但可以通过 iframe 内的链接来实现吗？

我通过将点击功能替换为悬停功能来管理脚本的工作，因此基本上它可以正常工作，但我需要使用点击功能来做到这一点。

【问题讨论】：

很抱歉，之前确实尝试过一些脚本但没有成功，所以再次问了一个新问题。

【参考方案1】：

你可以

$('#iFrameID').contents().find('#linkID').click(function()
$('.sliding_div_on_index_page').animate('top': '-190px', 1000);
); ); 

将 linkID 替换为 iframe 中要触发 点击的链接的ID > 和 iFrameID 以及包含 链接的 iframe 的 ID。

例如，该代码可以在以下 HTML 中工作：

带有iframe的页面：

<iframe id = 'iFrameID' src = 'yourPage.html' />

yourPage.html 或 src 的iframe:

<a id = 'linkID'>Click Me</a>

【讨论】：

感谢雪人。离线尝试了这个，它没有用。我需要先上传html吗？ index 和 iframe 页面属于同一个域，所以这应该没问题。

@easyrider 你能发布页面吗？还有，网上能用吗？另外，看看如果 HTML 被上传会发生什么/检查页面是否没有保存。另外，ID 是否匹配？

我可以发布页面，但它非常大，所以我只展示了一小部分。不，您的代码无法离线运行。

@easyrider 我知道它不能离线工作，但它可以在线工作吗？

@easyrider 更改<a href="home.html" target="content">Who we are</a> 到 <a id="linkID" href="home.html" target="content">Who we are</a>。另外，将您的 iFrame 的 ID 设为 iFrameID。