如何使用 jquery 访问 iFrame 父页面?

IT技术 javascript jquery iframe
2021-01-15 20:57:22

我有一个 iframe,为了访问父元素,我实现了以下代码:

window.parent.document.getElementById('parentPrice').innerHTML

如何使用jquery获得相同的结果?
更新:或者如何使用 jquery 访问 iFrame 父页面?

6个回答

要在 iFrame 的父级中查找,请使用:

$('#parentPrice', window.parent.document).html();

$() 包装器的第二个参数是要搜索的上下文。这默认为文档。

酷 - 在他感谢你之前你已经表示感谢。StackOverflow 可能有时区问题?
2021-03-18 20:57:22
@belugabob 这是巫师的错。
2021-03-20 20:57:22
这仅在 iframe 的源加载了 jQuery 时才有效。根据我的经验,iframe 源不会有 jQuery,但通常需要调用父级的 jQuery 函数之一。要做到这一点,请使用: window.document.$("#parentPrice").html() 这是 Álvaro G. Vicario 发布的答案。
2021-03-21 20:57:22
你也可以这样做: $(window.parent.document).find("#parentPrice").html();
2021-04-06 20:57:22
对于那些使用window.open 启动windoid 的人,不要忘记那个旧的JS 标准window.opener.document。$("#someDiv", window.opener.document) 有效。
2021-04-11 20:57:22

如何使用 jquery 访问 iFrame 父页面

窗口.父.文档。

jQuery 是一个基于 JavaScript 的库,而不是它的完全替代品。您不必用涉及 $ 的内容替换最后一个 JavaScript 表达式。

+1。jQuery 很棒,但很多简单问题的答案似乎都是“使用 jQuery”。如果您无论如何都要加载库,那很好,但不要将其加载为一项任务。此外,人们似乎担心 JS 性能,然后在 JS 之上使用 API 来完成没有 API 的轻松(并且可能更快)的事情。
2021-03-19 20:57:22
@bobince:显然,您应该始终用 jQuery 替换所有 Javascript。这就像培根;不存在越少越好的情况。;)
2021-03-20 20:57:22
@Grant 虽然我确实梦想 jQuery 成为浏览器中的本机代码。
2021-03-28 20:57:22
@Blowski:那是我的噩梦!jQuery 包含许多极其复杂和脆弱的“按我的意思做”的代码,这些代码完全不适合放在官方 API 中。
2021-03-29 20:57:22
OP 已经有 window.parent.document,所以这没有回答任何问题。想象一下,选择器逻辑比元素的 ID 复杂得多,在这种情况下 jQuery 非常方便。我觉得问题是“我怎么用法语说‘你好’?” 这个答案是“说德语”。
2021-04-07 20:57:22

如果您需要在父文档中查找 jQuery 实例(例如,调用插件提供的实用程序函数),请使用以下语法之一:

  • window.parent.$
  • window.parent.jQuery

例子:

window.parent.$.modal.close();

jQuery 被附加到window对象上,window.parent就是这样。

我将 iframe 用作用户控件。这让我保持干净整洁。
2021-03-16 20:57:22

您可以使用以下方法从 iframe 中访问父窗口的元素window.parent

// using jquery    
window.parent.$("#element_id");

这与以下内容相同:

// pure javascript
window.parent.document.getElementById("element_id");

如果你有多个嵌套的 iframe 并且你想访问最顶层的 iframe,那么你可以这样使用window.top

// using jquery
window.top.$("#element_id");

这与以下内容相同:

// pure javascript
window.top.document.getElementById("element_id");

在父窗口中放置:

<script>
function ifDoneChildFrame(val)
{
   $('#parentPrice').html(val);
}
</script>

并在 iframe src 文件中放置:

<script>window.parent.ifDoneChildFrame('Your value here');</script>