Javascript html5设置父脚本中iframe的消息处理程序

我需要测试一种情况，在这种情况下，我有一个父窗口承载一个iframe，它将是空的。我需要使用iframe作为父资源和跨域资源之间的代理。我已经创建了一个简单的函数，它应该尝试将一条消息从父级发布到子级iframe

我试图在父级的javascript中为子级iframe设置一个处理程序，但就我的一生而言，我无法找出语法来让它正常工作。我已经尝试使用addEvent帮助程序从我在现代Javascript开发和设计中看到的示例中正确添加事件（对于IE和其他人）：

addEvent: function(obj, type, fn) {
    if (obj && obj.addEventListener) {
        obj.addEventListener(type, fn, false);
    } else if (obj && obj.attachEvent) {
        obj.attachEvent('on' + type, fn);
    }
}

我当前尝试为onmessage设置处理程序的方式如下：

document.getElementById("frame1").onmessage = function(e) {
    alert(e.data);
};

我还认为可能需要访问元素的contentWindow，但onmessage似乎不存在

是否有一种属性或方法可以访问iframe，使其看起来像一个窗口，并且可以处理onmessage

更新

我可以看到onmessage设置为函数的值，甚至可以警告（…）该值以确定它确实是我想要的函数，但我看不到在子iframe上调用postMessage时调用它。

您的实现不正确。

onmessage

事件必须绑定到帧的窗口。由于框架的内容来自不同的原点，因此只能在框架的一侧执行此操作。由于出现问题，您无法从页面绑定此事件

如果同一原产地政策不受影响，此代码将起作用：

// Bind event to the frame's  window  object
var frame1_window = document.getElementById("frame1").contentWindow;
frame1_window.onmessage = function(e) {
    alert(e.data);
};
frame1_window.postMessage("Hello from same domain", "http://yourdomainhere.com");

示例（域：

jsfiddle.net

）：

---

示例（域：

fiddle.jshell.net

）：

试图通过document.getElementById（…）.contentWindow为iframe设置onmessage属性，但我的js调试从未返回。当我尝试在document.getElementById（…）@ShelbyZ上设置它时，我没有看到相同的问题。我的答案中包含了两个演示，显示了警报。我还更正了一个输入错误：

vat

必须是

var

。因此，如果只有一个父窗口和一个iframe不在同一个域上，则似乎不可能实际处理子窗口的onmessage，因为这将违反同一来源策略。在这一点上，它将要求iframe包含另一个域与顶级父级相同的帧，这样才能正常工作。@ShelbyZ这是可能的。先决条件是在帧侧定义

onmessage

事件。跨源

postMessage

成功应用的一个例子是iframe中的无铬[YouTube]（）播放器。我觉得我试图完成的是一个大的破解，也许我不明白我想解决的问题是什么。实际上，我已经尝试过在框架一侧定义消息，效果非常好。我不确定我会有多少奢侈。