javascript - dispatchEvent() 函数作为参数，执行函数而不是传递它

Question

我正在尝试将事件分派(dispatch)给 window.top.document 作为

frame1 中的代码:

function callingBell(){
    alert('ding dong');
}

 var event = window.top.document.createEvent("CustomEvent");
 event.initCustomEvent('READY', false, false, { 'bell': callingBell });
 window.top.document.dispatchEvent(event);

在第 2 帧中:

window.top.document.addEventListener('BOMREADY', function(e) {

    bell= e.detail.bell;

}, false);

更多详情:我有一个父jsp。在父 jsp 中，我有 2 个子 jsp。该场景第一次运行良好。当我在父框架未刷新的情况下刷新/重新加载两个子 jsp 时，会出现上述问题。显示“叮咚”警报的次数正是我刷新子框架的次数。含义:在第 7 次刷新时，警报出现 7 次。我怀疑 window.top.document 中的某些内容在将函数传递给监听器之前已损坏以执行该函数。

在第二次刷新之后，当执行到“window.top.document.dispatchEvent(event)”时，不是首先进入目标监听器，而是调用callingBell函数，并在执行到监听器代码之前显示警报.

此外，如果 callingBell 不是一个函数，则将按预期调用一次监听器。

更新:我可以通过简单地删除 addEventListener 中的事件监听器来解决这个问题:

  e.target.removeEventListener('READY', arguments.callee, false);

但是，我不能将此作为最终解决方案，因为我需要为稍后的事件监听。

Answer 1

我怀疑您遇到此问题是因为您没有删除回调中的监听器。这就是为什么每次实际刷新时都会堆叠事件并获得多个警报。

这就是我实际要做的:

window.top.document.addEventListener('BOMREADY', _callback(e), false);

function _callback(e) {
  window.top.document.removeEventListener('BOMREADY', _callback(e), false);

  // Keep executing your function
  bell = e.detail.bell;
  bell();
}

希望对您有所帮助!