将页面从 iframe 加载到主窗口答案

【问题标题】：Load page from iframe into main window将页面从 iframe 加载到主窗口
【发布时间】：2013-01-18 16:32:42
【问题描述】：

我有一个 MVC 站点，其中有一个页面（我们称之为 x），其中有一个 iframe（我们称之为 x2）。当我与 iframe (x2) 交互时，如果我最终使用特定的 url（我们称之为 y），我希望该 url (y) 不要在 iframe (x2) 中打开，而是在浏览器中打开作为主页。我也希望将网址更改为 y 。我需要什么 JQuery 魔法？

编辑

我的错，我解释得不够清楚。我不会使用我单击的链接转到该页面，但外部站点会从 iframe 重定向到该页面。

【问题讨论】：

您是否可以控制页面 Y？
我确实可以控制 y
那么我会在下面使用我编辑的答案，因为基本上它会做同样的事情。查看我的编辑。

标签： jquery asp.net-mvc-3

【解决方案1】：

您可以通过 window.postmessage 来考虑这样做。我做了类似的事情。我的一个页面有一个 iframe。单击某个链接，而不是更改 iframe，而是更改父页面。

http://davidwalsh.name/window-postmessage 有一篇关于如何使用它的好文章。本质上，您将在第 x 页上设置一个侦听器。当您加载页面 y 时，让页面 y 向父窗口发布消息。 X 将监听该消息并采取相应措施。

编辑： 添加一个监听器来检查 iFrame 的 onLoad 事件。每次查看 iFrame 的 URL。如果该 URL 与页面 Y 匹配，则强制页面 X 更改 URL。

【讨论】：

这似乎是 HTML 5 的东西 - 并非我们所有的客户都有最新的浏览器
那么你可能运气不好。您仍然很可能使用 post.message。作为后备，设置一个侦听器来检查 URL。 stackoverflow.com/questions/938180/get-current-url-from-iframe 看到页面 Y 的 URL 后，强制更改页面。不理想，但倒退。仅仅因为您的用户都没有新的浏览器（没有人有）并不意味着您不能使用新技术。新技术可以解决这样的问题。只需提供一个合适的后备方案，并告诉在高速公路上驾驶 Model-T 的人去买一辆新车。
stackoverflow.com/questions/2429045/… 您可以阅读如何监听 iFrame URL 更改事件。
我使用 post.message 而不是我描述的方法的原因是因为我从页面 y 获取 HTML 的高度并将该信息发布到页面 x。然后我根据该信息调整 iframe 的大小。 IE 使用有时会看到过高的 iFrame 或滚动条，但使用良好浏览器的用户会看到与所需大小完全匹配的 iframe 和页面。

【解决方案2】：

不需要 jQuery，只需在 <a> 上添加一个 target：

<a href="@Url.Action("Action", "Controller", { property = 'foo' })" target="_parent">Link</a>

【讨论】：

这行不通。网址不在我们身边。它是来自外部站点的重定向。
在这种情况下，由于同源策略/XSS，您无法通过 iframe 与另一个域的内容进行交互，因此您需要的内容是不可能的。
您可以，通过留言。但仍然必须有权访问 iFrame 中的页面。我是跨域做的。
我相信您可以通过在 URL 末尾使用标签加上循环在目标景点中检查它

【解决方案3】：

我相信您可以通过在 URL 末尾使用主题标签和循环来在目标视线中检查它。更改主题标签不会重新加载 URL 并允许目标框架读取它。这很hacky，但它应该可以工作。

【讨论】：