Question

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

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

我是否需要在匿名函数之外定义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);

Answer 1

这可能会解决问题：

window.onmessage = rp_receive_message;

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

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

如果您不喜欢任何一种解决方案，您必须设置一个全局变量，它几乎没有任何差别或大大优于上述变量。全局可以是一个简单的布尔值来检查事件是否已附加，或者它可以是您自己更新的附加事件列表。 AFAIK，我很确定，没有本机JS解决方案可以将事件监听器列表附加到特定事件。像jQuery这样的库维护列表并让你阅读它们;并且可能有其他技术可以解决您的一般问题。

保持bookmarklet不会生成多个事件侦听器

1 个答案: