如何使用帶參數的函數添加和刪除事件偵聽器？

對不起，如果這是一個常見問題，但我找不到任何通過搜索似乎相關的答案。如何使用帶參數的函數添加和刪除事件偵聽器？

如果我附上一個事件監聽器是這樣的：

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

如何使用帶參數的函數添加和刪除事件偵聽器？

回答

相關問題