JavaScript: remove event listener
You need to use named functions.
Also, the click
variable needs to be outside the handler to increment.
var click_count = 0;function myClick(event) { click_count++; if(click_count == 50) { // to remove canvas.removeEventListener('click', myClick); }}// to addcanvas.addEventListener('click', myClick);
EDIT: You could close around the click_counter
variable like this:
var myClick = (function( click_count ) { var handler = function(event) { click_count++; if(click_count == 50) { // to remove canvas.removeEventListener('click', handler); } }; return handler;})( 0 );// to addcanvas.addEventListener('click', myClick);
This way you can increment the counter across several elements.
If you don't want that, and want each one to have its own counter, then do this:
var myClick = function( click_count ) { var handler = function(event) { click_count++; if(click_count == 50) { // to remove canvas.removeEventListener('click', handler); } }; return handler;};// to addcanvas.addEventListener('click', myClick( 0 ));
EDIT: I had forgotten to name the handler being returned in the last two versions. Fixed.
canvas.addEventListener('click', function(event) { click++; if(click == 50) { this.removeEventListener('click',arguments.callee,false); }
Should do it.
You could use a named function expression (in this case the function is named abc
), like so:
let click = 0;canvas.addEventListener('click', function abc(event) { click++; if (click >= 50) { // remove event listener function `abc` canvas.removeEventListener('click', abc); } // More code here ...}
Quick and dirty working example: http://jsfiddle.net/8qvdmLz5/2/.
More information about named function expressions: http://kangax.github.io/nfe/.