Javascript/DOM: How to remove all events of a DOM object? -

just question: there way remove events of object, e.g. div?

edit: i'm adding per div.addeventlistener('click',eventreturner(),false); event.

function eventreturner() {     return function() {         dosomething();     }; } 

edit2: found way, working, not possible use case:

var returnedfunction; function addit() {     var div = document.getelementbyid('div');     returnedfunction = eventreturner();     div.addeventlistener('click',returnedfunction,false); //you have take here var , not direct call eventreturner(), because function address must same, , change, if function called again. } function removeit() {     var div = document.getelementbyid('div');     div.removeeventlistener('click',returnedfunction,false); } 

i not sure mean remove all events. remove handlers specific type of event or event handlers 1 type?

remove event handlers

if want remove event handlers (of type), clone element , replace clone:

var clone = element.clonenode(); while (element.firstchild) {   clone.appendchild(element.lastchild); } element.parentnode.replacechild(clone, element); 

note: preserve attributes , children, not preserve changes dom properties.

---

remove "anonymous" event handlers of specific type

the other way use removeeventlistener() guess tried , didn't work. here catch:

calling addeventlistener anonymous function creates new listener each time. calling removeeventlistener anonymous function has no effect. anonymous function creates unique object each time is called, not reference existing object though may call one. when adding event listener in manner sure added once, permanent (can not removed) untill object added destroyed.

you passing anonymous function addeventlistener eventreturner returns function.

you have possibilites solve this:

1. don't use function returns function. use function directly:

   function handler() {     dosomething(); }  div.addeventlistener('click',handler,false); 

2. create wrapper addeventlistener stores reference returned function , create weird removeallevents function:

   var _eventhandlers = {}; // somewhere global  function addlistener(node, event, handler, capture) {     if(!(node in _eventhandlers)) {         // _eventhandlers stores references nodes         _eventhandlers[node] = {};     }     if(!(event in _eventhandlers[node])) {         // each entry contains entry each event type         _eventhandlers[node][event] = [];     }     // capture reference     _eventhandlers[node][event].push([handler, capture]);     node.addeventlistener(event, handler, capture);  }  function removealllisteners(node, event) {     if(node in _eventhandlers) {         var handlers = _eventhandlers[node];         if(event in handlers) {             var eventhandlers = handlers[event];             for(var = eventhandlers.length; i--;) {                 var handler = eventhandlers[i];                 node.removeeventlistener(event, handler[0], handler[1]);             }         }     } } 

   and use with:

   addlistener(div, 'click', eventreturner(), false) // , later removelisteners(div, 'click') 

demo

note: if code runs long time , creating , removing lot of elements, have make sure remove elements contained in _eventhandlers when destroy them.