Question

我需要向iframe发送帖子消息（window.postmessage）。
目前它的工作，如果我在父页面内有单个iframe。但我想让它适用于嵌套的iframe 标准是：

我可以在最后一个iframe中添加监听器代码。
不知道iframe嵌套的长度。
需要双向沟通，从父母到孩子，也可以通过叶子iframe到父母。

我厌倦了第三方的iframe，请给我一些合适的解决方案。

Answer 1

您可以实现一个自己向上或向下传播事件的事件系统。

在所有iframe中添加这样的内容会传播事件。

//create a jquery object to use the bind/trigger event system
var vent = $({});

function trigger(event, args) {
    //trigger for the current iframe
    vent.trigger(event, args);

    //propagate down for all nested iframes
    $.each(getAllIframes(), function(i, iframe) {
        iframe.trigger(event, args);
    });
}

function bind(event, callback) {
    vent.bind(event, callback);
}

function getAllIframes() {
    return $("iframe").map(function(){
      return this.contentWindow;
    });
}

您可以以类似的方式实现事件冒泡，但必须具有某种绑定到所有子帧的初始化逻辑。

Answer 2

很老的问题，但是，我遇到了类似的问题，因此我找到了解决方案。将来可能对其他人有帮助。

我们始终可以使用postMessage和iframe在两个方向上iframe嵌套.parent的任何.frames[i][j][k]

例如，如果要将消息发布到第三iframe内的第一iframe，则可以这样做：

window.frames[2][0].postMessage(msg, "*");

在https://javascript.info/cross-window-communication上查看更多信息

对于iframe，我们可以使用以下方法访问父/子窗口：


window.frames –嵌套窗口对象的集合，

window.parent，window.top是父窗口和顶部窗口的引用，

iframe.contentWindow是标记内的窗口。

如何访问嵌套的iframe？

2 个答案: