如何使用带参数的函数添加和删除事件侦听器？

对不起，如果这是一个常见问题，但我找不到任何通过搜索似乎相关的答案。如何使用带参数的函数添加和删除事件侦听器？

如果我附上一个事件监听器是这样的：

window.addEventListener('scroll', function() { check_pos(box); }, false);

它似乎并没有工作，稍后再尝试删除它，就像这样：

window.removeEventListener('scroll', function() { check_pos(box); }, false);

我想这是因为addEventListener和removeEventListener方法需要对同一个函数的引用，而我为它们提供了匿名函数，尽管这些函数在代码中完全相同，但字面上并不相同。

如何更改我的代码以致致电removeEventListener正常工作？ “box”参数指的是我在屏幕上跟踪的的名称;也就是说，我希望能够为每个订阅scroll事件一次（数量不尽相同），并且一旦check_pos()函数测量到某个位置，它就会调用另一个函数，并且还会移除事件侦听器以释放事件系统资源。

我的预感是解决方案将涉及关闭和/或命名匿名函数，但我不确定具体是什么样子，并且会感激一个具体的例子。

希望是有道理的。谢谢你的帮助！

来源

2010-06-07 Bungle

你有没有试过保持对匿名函数的引用（就像你所建议的）？

所以：

var listener = function() { 
    check_pos(box); 
}; 

window.addEventListener('scroll', listener, false); 
... 
window.removeEventListener('scroll', listener, false);

Mozilla的文档suggest同样的事情。

来源

2010-06-07 16:47:45

谢谢，Vivin - 纠正我，如果我错了，但我不认为这将允许我设置多个事件侦听器具有不同值的“盒子”，这是我需要做的。参数“盒子”不是全局变量。例如，我只是使用文字值，我可能会调用'window.addEventListener（'scroll'，function（）{do_something（'string1'）;}，false）;''以后'window.removeEventListener（'scroll'，function ）{do_something（'string1'）;}，false）;''和后面的'window.addEventListener（'scroll'，function（）{do_something（'string2'）;}，false）;'等 – Bungle 2010-06-07 19:46:26

有一个通过使用闭包来添加多个事件侦听器的方法（请参阅http://stackoverflow.com/questions/2276961/is-there-for-window-onload-in-javascript/2277000#2277000）。不过，如果你想做一些严肃的事件处理，我会建议使用jQuery。它使它更容易。 – 2010-06-09 00:44:24

var listener; 

listener = function(){ 

if(window.target != anotherEvent.target) 
{ 
    ...CODE where 

    window.removeEventListener('click', listener , false); 

}; 

window.addEventListener('click', listener ,false);

来源

2012-10-15 20:52:25 Rodrigo

如何使用带参数的函数添加和删除事件侦听器？

回答

相关问题