确定当前/自己的 iframe

发布于 2024-10-12 04:52:55 字数 646 浏览 7 评论 0原文

确定页面正在显示的 iframe DOM 元素的最佳方法是什么?

当 iframe 的内容真正完成加载时,我需要通知父窗口(iframe onload 看起来像是 WebKit 的骗局)。

考虑以下场景:

  • 父窗口加载一个新的 iframe
  • 加载的 iframe 从父窗口调用一个函数,并发送对其 iframe DOM 元素的引用(类似于“sender”参数)。
  • 父级调用的函数会破坏 iframe。

也欢迎就这种框架间通信的替代解决方案提出建议。

我遇到的一个问题是 Safari / Chrome / WebKit 浏览器显然过早地触发了 iframe 的 onload 事件 - 我尝试将表单数据(带有文件上传)发送到 iframe 并获得了 onload code> 处理程序清除 元素的值并销毁 iframe,导致表单提交中止,因此我无法使用 < code>onload 在这种情况下(顺便说一句,这是一个功能还是一个错误?)。

另一个用例是 iframe 执行某些操作并希望与父级交互。

What is the best way to determine the iframe DOM element a page is being displayed in ?

I need to notify the parent window when the iframe's contents have really finished loading (iframe onload looks like a scam with WebKit).

Consider the following scenario:

  • Parent window loads a new iframe
  • The loaded iframe invokes a function from the parent window and sends along a reference to its iframe DOM element (sort of a "sender" parameter).
  • The parent's invoked function destroys the iframe.

Suggestions on alternative solutions to this inter-frame communication are also welcome.

One problem I faced was that Safari / Chrome / WebKit browsers apparently fire the iframe's onload event too early – I tried sending form data (with file upload) to an iframe and had the onload handler clear the <input type="file" /> element's value and destroy the iframe, causing the form submission to be aborted, so I cannot use onload in that case (btw, is that a feature or a bug ?).

Another use case is where the iframe does something and wants interact with the parent.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

没有心的人 2024-10-19 04:52:55

就像 Stefaan id 所说的 window.parent 但你应该检查 window.frameElement也。

Like Stefaan id say window.parent but you should check window.frameElement too.

赠我空喜 2024-10-19 04:52:55

使用 window.parent 你可以获取父窗口。您还可以调用它的方法。因此,使用以下代码,您可以通知 iframe 父级您已完成加载(您需要在父窗口中具有一个 notificationLoaded 函数。

window.parent.notifyLoaded(window);

因为我们给了我们自己的窗口,所以父级可以循环所有已知的 iframe 并检查加载了哪一个(使用iframe.contentWindow 获取某个iframe的窗口)

With window.parent you can get the parent window. You can also call methods on it. So with the following code you can notifiy the iframe parent that you have finished loading (you need to have a notifyLoaded function in the parent window.

window.parent.notifyLoaded(window);

Because we gave our own window the parent can loop all known iframes and check which one is loaded (using iframe.contentWindow to get the window of a certain iframe)

萌酱 2024-10-19 04:52:55

有多种方法可以在框架与其父框架之间进行通信。

最简单的是如果两者都具有相同的 document.domain 设置,在这种情况下它们可以直接通信。

的哈希组件

如果没有,则有几种不同的方式进行跨域通信,例如通过设置/读取 iframe url 查看此处了解更多信息

There are several ways to communicate between a frame and it's parent.

The easiest is if both have same document.domain set, in which case they can communicate directly.

if not there are several different ways of doing cross domain communication, for instance by setting/reading the hash-component of the iframe url

Look here for more information

清风夜微凉 2024-10-19 04:52:55

您可以遍历父文档内的所有 iframe 元素,并将 iframe 元素的 contentWindow-property 与 iframe 内的 window-object 进行比较(应该相等,但我还没有测试它)

PS:现在测试它,工作正常 http://www.jsfiddle.net/doktormolle/CMdLZ/

You can walk all iframe-elements inside the parent document and compare the contentWindow-property of the iframe-elements with the window-object inside the iframe(should be equal, but I didn't test it yet)

P.S.: tested it now, works fine http://www.jsfiddle.net/doktormolle/CMdLZ/

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文