添加具有多个参数的事件侦听器并稍后将其删除答案

【问题标题】：Add an event listener with sevral parameters and remove it later添加具有多个参数的事件侦听器并稍后将其删除
【发布时间】：2012-10-17 04:11:02
【问题描述】：

这似乎是一个非常受欢迎的问题，尽管我似乎没有找到任何相关的答案。

我附加了一个事件监听：

window.addEventListener('scroll', fnName, false);

问题是 fnName 需要几个参数，所以我尝试了l

window.addEventListener('scroll', (function( e ){
   return fnName(e, some, param )
}()), false)

但后来window.removeEventListener 不再工作，所以我尝试了：

window.removeEventListener('scroll', (function( e ){
   return fnName(e, some, param )
}()), false)

【问题讨论】：

你的第二个 addEventListener 也不应该工作，除非 fnName 返回一个函数。
归根结底，如果您想删除它，您需要保留实际分配的处理程序。您的最后一个示例将不起作用，因为您正在立即调用处理程序。

标签： javascript event-listener

【解决方案1】：

由于我在 AMD 模块架构中，并且我试图将事件处理程序维护为私有方法，所以我刚刚想出了这个解决方案：

define(function(){

 var fnNmae = function( e ) {
   // i can now access fnName.param
 };

 return { 
   init : function() {
    fnName.param = {
      one : 1,
      two : 2
    }

   window.addEventListener('scroll', fnName, false);
   }

})

【讨论】：

【解决方案2】：

你有一个自初始化函数：

(function() { alert("a") })();

您可能会注意到此代码提醒"a"。

然后在你的函数中初始化fnName。你要做的是：

window.addEventListener('scroll', function( event ) {
   fnName(event, some, param );
}, false);

当滚动事件被触发时，您就可以使用您的自定义参数初始化fnName。

正如所指出的，如果您想再次删除处理程序，您将需要一个命名函数：

function myFn( event ) {
   fnName(event, some, param );
}

window.addEventListener('scroll', myFn, false); // Add event listener
window.removeEventListener('scroll', myFn, false); // Remove event listener

【讨论】：

【解决方案3】：

每次你声明一个匿名函数时，它都会创建一个新的函数实例。如果要删除现有函数，则需要保留函数实例的副本。

var temp = function () {
    fnName(e, some, param);
};
window.addEventListener('scroll', temp, false);
//elsewhere,
window.removeEventListener('scroll', temp, false);

我还应该注意使用

(function (e){
     return fnName(e, some, param)
}());

立即以undefined 作为第一个参数调用fnName。我怀疑那是你的意图。

【讨论】：

好吧，虽然问题是事件被附加在 RequireJS 模块的暴露部分，所以返回 { init : function(){... there }} 我希望将事件处理程序声明为“私有”方法。有没有办法解决这个问题？

【解决方案4】：

window.addEventListener('scroll', (function( e ){
   return fnName(e, some, param )
}), false)

只需删除()，避免定义后直接执行

【讨论】：

但是你有同样的删除处理程序的问题，这就是 OP 所要求的。
oh.. jepp... 您还应该将代码转移到另一个函数（例如 fnNameHelper）并设置/删除它