Question

我有两个这样的文件：

http://mydomain/nsobd.html

<html>
    <body>
        <p name="parentElem" id="parentElem">No sign of Big Dave</p>
        <iframe src="http://subdomain.mydomain/nsobd2.html"></iframe>
    </body>
</html>

http://subdomain.mydomain/nsobd2.html

<html>
    <body>
        <a href="???" id="childLink">No sign of Big Dave</a>
    </body>
</html>

我想要的是，当有人点击iframe中的childLink时，parentElem会滚动到视图中。

我试过了：

使用<a href="#parentElem" target="_parent"> - 这会在父框架中加载http://subdomain.mydomain/nsobd2.html#parentElem。
使用<a href="javascript:document.findElementById('parentElem').scrollIntoView()"> - 由于两个文档位于不同的子域中，因此无效。

还有其他想法吗？

Answer 1

由于您尝试在两个域之间进行通信，因此简短的答案是您不能。您不能因为在浏览器级别实施限制而禁止跨站点脚本。

例如，假设我注册了域名superwinningcontest.com并发送了人们电子邮件的链接。当他们加载主页面时，我可以在那里隐藏一些iframe并阅读他们的Facebook提要，查看最近的亚马逊或PayPal交易，或者 - 如果他们使用的服务没有实现足够的安全性 - 将资金转出他们的账户。这就是为什么JavaScript仅限于同域和同一协议。 [source]

但是，您可以通过cross-document-messaging实现目标。 github项目porthole可能能够帮助您。因此，不是从iframe调用或执行父窗口中的某个函数，而是向父窗口发送消息“嘿，介意滚动到X？”来自iframe。当父帧收到此消息时，它可以决定执行某个函数，然后可以滚动到位置X.

this StackOverflow thread似乎有很多相关的答案。例如，在this answer中，用户实现了可能适合您的跨文档消息传递方案。

从iframe中滚动父文档

http://mydomain/nsobd.html

http://subdomain.mydomain/nsobd2.html

1 个答案: