Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Update: How to find event listeners on a DOM node in prototype?

I'm looking for an updated answer to this question.

It seems that Event.observers is no longer used (perhaps to avoid memory leaks) in Prototype 1.6+, so how do I track down now what event listeners are attached to an element?

I know Firebug has a "break on next" button, but there are several mouse listeners on the body element that execute before I can get to the behavior that I want on another particular element, so is there some other way?

like image 333
Keith Bentrup Avatar asked Sep 14 '09 16:09

Keith Bentrup


People also ask

How do you check if there is an event listener exists?

To check whether dynamically attached event listener exists or not with JavaScript, we can get and set the element's listener attribute. export const attachEvent = ( element: Element, eventName: string, callback: () => void ) => { if (element && eventName && element. getAttribute("listener") !== "true") { element.

Where are event listeners stored?

Event classes are typically stored in the app/Events directory, while their listeners are stored in app/Listeners . Don't worry if you don't see these directories in your application as they will be created for you as you generate events and listeners using Artisan console commands.

How do you find the events of an element?

right click on the target element -> select " Inspect element " Scroll down on the right side of the dev frame, at the bottom is ' event listeners '. Expand the tree to see what events are attached to the element.


1 Answers

I've update the answer you linked to with more comprehensive Prototype coverage accounting for changes in versions 1.6.0 to 1.6.1.

It got very messy in between there, but 1.6.1 is somewhat clean:

var handler = function() { alert('clicked!') };
$(element).observe('click', handler);

// inspect
var clickEvents = element.getStorage().get('prototype_event_registry').get('click');
clickEvents.each(function(wrapper){
    alert(wrapper.handler) // alerts "function() { alert('clicked!') }"
})
like image 158
Crescent Fresh Avatar answered Sep 20 '22 23:09

Crescent Fresh