javascript - postMessage 或 addEventListener 不起作用

Question

以下 JavaScript 代码使用 HTML5 postMessage / addEventListener 函数向自身发送消息：

window.addEventListener('testMsg', function(event) {
   alert('got a message');   /* Never happens. Why? */
}, false );

window.addEventListener('load', function(event) {
   alert('sending message');    
   window.postMessage('testMsg', '*');
}, false);

相应的小提琴：

http://jsfiddle.net/ZGvLg/3/

永远不会收到消息。是什么原因？

Answer 1

我已经修改了小提琴。你听错了事件。

小提琴

应该

window.addEventListener('message', function(event) {
    alert('got a message');   /* Never happens. Why? */
}, false );

window.addEventListener('load', function(event) {
    alert('sending message');    
    window.postMessage('message', '*');
}, false);

Answer 2

您正在侦听一个testMsg事件，但postMessage会触发一个message事件。

Answer 3

就像其他人说的那样，您需要监听"message"事件，而不是"testMsg". 这是工作代码的更清晰的代码示例

window.addEventListener('message', function(event) {
    alert('got a message'); // event.data == "hello world"
}, false );

window.addEventListener('load', function(event) {
    alert('sending message');
    window.postMessage('hello world!', '*');
}, false);