javascript - 使用 IFrame 和 Javascript 滚动父页面

Question

我正在寻找一些关于什么应该是基本脚本的帮助(我认为)，但我自己也不太明白..

我有一个带有 iFrame 的页面，显示了一个我只能访问页眉的页面。我想这样做，以便当有人在 iFrame 窗口中单击任何链接(标记)时，它会将我的父页面滚动到顶部(或特定位置)。这可能吗？

编辑:此外，如果这很重要，我已经在使用 David Bradshaw 的 iFrame resizer 脚本动态调整框架的大小，它使用 postmessage 来传达 frame->page。 https://github.com/davidjbradshaw/iframe-resizer

Edit2:父窗口和iframe窗口是跨域的

Answer 1

参见 Trigger events in iframe's parent window

将一些 JS 添加到您的 iframe 页面:

$(document).ready(function(){
    $('a').click(function(){
        window.parent.$(window.parent.document).trigger('scroll');
    });
});

然后在父页面:

$(document).bind('complete', function(){
    //Add scroll code.
});

您可以使用 post message 来做类似的事情，但是如果您控制两个页面并且它们在同一个域中，这应该可行。如果它们位于不同的域(您未指定)，您将无法使用我认为不完全跨浏览器兼容的 postMessage，因此不会在所有设置上工作，并且确实没有后备。

如果你想使用 postMessage 并且你正在使用插件，只需执行类似的操作

window.addEventListener("message",function(event){
    if(event.origin == 'http://yourdomain.com'){
        if(event.data == 'messageString'){
            //Add scroll code
        }
    }
});