防止小书签生成多个事件侦听器答案

【问题标题】：Keeping bookmarklet from generating multiple event listeners防止小书签生成多个事件侦听器
【发布时间】：2012-09-28 05:22:59
【问题描述】：

我目前正在开发一个可以打开 iframe 并设置 postMessage 来回通信的书签。这一切都很好。但是，似乎因为小书签是作为匿名函数加载的，所以如果我在一个页面上多次运行小书签，听众就会成倍增加。

是否有某种方法可以跟踪这些 addEventListener 以使它们不会加倍？

我需要在匿名函数之外定义 rp_receive_message 吗？

下面是代码示例：

var rp_receive_message = function (e) {
    var response = e.data;
    console.log("got message with "+ response);
  };

if (window.addEventListener) {
  window.addEventListener('message', rp_receive_message, false);
} else {
  window.attachEvent('onmessage', rp_receive_message);
}

var s1 = window.document.createElement('iframe');

s1.setAttribute('src', 'http://mydomain.com/iframe.html');
s1.setAttribute('id', 'testiframe');
s1.setAttribute('width', '700');
s1.setAttribute('height', '550');
s1.setAttribute('frameBorder', '0');
s1.setAttribute('onload', 'this.contentWindow.postMessage(window.location.href, "http://mydomain.com/iframe.html");');


document.getElementById('container').appendChild(s1);

【问题讨论】：

标签： javascript iframe bookmarklet

【解决方案1】：

大概这样就可以解决问题了：

window.onmessage = rp_receive_message;

正如您所建议的，下面的代码本身可能就足够了。我不知道 addEventListener 和 attachEvent 是否会多次添加相同的函数，但如果它们会，我一点也不感到惊讶。我建议只是测试它。

window.rp_receive_message = function(){...}

如果您不喜欢任一解决方案，则必须设置一个全局变量，该变量看起来与上述几乎没有什么不同或大大优于上述方法。全局可以是一个简单的布尔值，用于检查事件是否已附加，也可以是您自己更新的附加事件列表。 AFAIK，我很确定，没有本地 JS 解决方案来获取事件监听器列表已附加到特定事件。 jQuery 等库维护列表并让您阅读它们；并且可能有其他技术可以优雅地解决您的一般问题。

【讨论】：

简单但可行的解决方案！似乎多次运行有效地用新的 rp_receive_message 覆盖 window.onmessage，而不是每次都为新的匿名函数的 rp_receive_message 创建一个新的侦听器。我将不得不在各种环境中进行尝试。谢谢！
有人知道为什么在 IE8 中的 window.onmessage 上调用 window.postMessage 似乎没有通过事件吗？在我上面的例子中（使用window.onmessage），e是未定义的，e.data当然不存在，但是函数被触发了。
` window.onmessage = function(e){ alert(e.data)}; window.postMessage('嘿','google.com'); ` 在 IE8 模式下的 IE9 上，导致“SCRIPT5007：无法获取属性“数据”的值：对象为空或未定义。 postMessage 调用该函数，但“e”未定义。有什么想法吗？
不确定。我在网上看到的表明它应该可以工作。也许尝试添加这个e = e || window.event;。