removeEventListener和带参数的匿名函数

我有一个文本输入，我添加了一个事件监听器。此事件侦听器通过onkeyup执行匿名函数。这个匿名函数包含一个foo函数。这个foo函数有一个参数number用于在控制台中显示数字。removeEventListener和带参数的匿名函数

而且我有一个按钮用于删除添加的事件侦听器。但是，当我点击这个按钮并输入文本输入时，事件侦听器不会被删除，所以foo函数会在控制台中再次显示数字。

这里的代码，很简单：

<input type="text" value="" id="input_text"> 

<input type="button" value="Remove Event Listener" onclick="deleteEventListener();"> 

<script type="text/javascript"> 

number = 0; 

//Function to display number in console : 
function foo(arg_number) 
{ 
    number = arg_number+1; 

    console.log(number);  
} 

//The text input : 
input_text = document.getElementById("input_text"); 

//Add event listener to the text input : 
input_text.addEventListener("keyup", function(){foo(number);}, false); 

//Function to remove event listener : 
function deleteEventListener() 
{ 
    input_text.removeEventListener("keyup", function(){foo(number);}, false); 
}

，您可以尝试：https://jsfiddle.net/5LtmLzqy/

你有一个想法？预先感谢你，亲切。

来源

2015-11-18 totoaussi

只需使您的功能成为外部功能即可。

从w3schools：

注意：要移除事件处理程序，与addEventListener（）方法中指定的功能必须是一个外部的功能，如在上述（myFunction的）的例子。

匿名函数，如element.removeEventListener("event", function(){ myScript });将不起作用。在一个全球arguments.callee

来源

2015-11-18 17:39:11

谢谢您的回复。如何使我的匿名外部函数？ – totoaussi

在函数foo之后加上'function foonumber（）{foo（number）;}'。 –

非常感谢，这是一个聪明的解决方案！解决了对你的感谢。 – totoaussi

它可以通过arguments.callee来实现，存储值作用域JavaScript变量，并通过该值作为removeEventListener()参数。

number = 0; 
    var myAnonymous = null; 
    //Function to display number in console : 
    function foo(arg_number) { 
     number = arg_number + 1; 
     console.log(number); 
    } 

    //The text input : 
    input_text = document.getElementById("input_text"); 

    //Add event listener to the text input : 
    input_text.addEventListener("keyup", function() { myAnonymous = arguments.callee; foo(number); }, false); 

    //Function to remove event listener : 
    function deleteEventListener() { 
     if (myAnonymous != null) 
      input_text.removeEventListener("keyup", myAnonymous); 
    }

来源

2015-11-18 18:11:48

非常感谢arguments.callee！ – totoaussi

removeEventListener和带参数的匿名函数

回答

相关问题