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

Question

很抱歉,如果这是一个常见问题,但我找不到任何通过搜索看似相关的答案.

如果我附加一个这样的事件监听器:

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

以后尝试删除它似乎不起作用,如下所示:

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

我假设这是因为addEventListener和removeEventListener方法需要引用相同的函数,而我已经为它们提供了匿名函数,虽然它们在代码中相同但并不完全相同.

如何更改代码以使调用removeEventListener工作？"box"参数指的<iframe>是我在屏幕上跟踪的名称; 也就是说,我希望能够scroll为每个事件订阅一次事件<iframe>(数量变化),一旦check_pos()函数测量某个位置,它将调用另一个函数并删除事件监听器以释放系统资源.

我的预感是解决方案将涉及一个闭包和/或命名匿名函数,但我不确定它看起来是什么样的,并且会欣赏一个具体的例子.

希望有道理.谢谢你的帮助!

Answer 1

您是否尝试过维护对匿名函数的引用(如您所建议的那样)？

所以:

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

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

Mozilla的文档提出了相同的建议.