postMessage() 生成错误“未定义不是函数”

postMessage() generates error "undefined is not a function"

本文关键字:未定义 函数 错误 postMessage      更新时间:2023-09-26

我正在尝试让postMessage()在iframe和我的主网站之间进行通信。但是,使用 MDN 上示例代码中给出的确切语法,我遇到了一个很好的Undefined is not a function错误。我已经尝试了几件事,例如在Javascript中初始化iframe并将其附加到我的页面,但这给我留下了同样的错误。同样,有单独的选择器来选择我的 iframe。

我有以下Javascript代码:

<script type="text/javascript">
    $(document).ready(function() {
        $('.editor').postMessage("A", "domain here");
    });
    function receiveMessage(event)
    {
        if (event.origin !== "domain here")
            return;
        // Do something
    }
    window.addEventListener("message", receiveMessage, false);
</script>

上面的脚本尝试在页面上向我的 iframe 发送消息,如下所示:

<iframe src="domain here/frameListener.html" class="editor"></iframe>

然后,它具有一个功能receiveMessage来捕获作为对主网页的响应而发送的任何消息。最后但并非最不重要的一点是,我已经尝试了这个问题中给出的答案: 但这并没有解决我的问题。因此,它不是重复的。

如何摆脱此错误消息?

postMessage不是

jQuery函数,所以你需要获取实际的window DOM元素并在其上调用它:

 $('.editor').get(0).contentWindow.postMessage("A", "domain here");

此外,您需要访问iframecontentWindow属性。以下是 MDN 文档的摘录:

otherWindow.postMessage(message, targetOrigin, [transfer]);

otherWindow

对另一个窗口的引用;这样的引用可能是例如,使用 iframe 的 contentWindow 属性获取元素,由 window.open 返回的对象,或者按命名或数字返回的对象窗口框架上的索引。