it-swarm.com.de

Angehängte/gebundene Ereignisse eines Elements mithilfe der Chrome-Entwicklungstools/Firebug/finden IE Entwickler-Symbolleiste

Bei der Untersuchung des DOM einer Seite würde ich gerne die angefügten Ereignisse eines Elements schnell wissen

Zum Beispiel, wenn eine Schaltfläche dieses HTML-DOM hat

<button id="button1">Click Me</button>

Und irgendwo (nicht an einem Ort, den ich im Voraus kenne) ist ein Ereignis zugeordnet, z.

$("#button1").click(function(){...});

Ich weiß, dass dies programmgesteuert erfolgen kann ( Kann ich mit jQuery an ein Element gebundene Ereignisse finden?

aber gibt es eine Möglichkeit, mit einem der Entwicklertools für Chrome/Firefox/IE eine Liste der Ereignisse anzuzeigen?


Update: Ich habe herausgefunden, dass ich in den neueren Chrome-Versionen eine Registerkarte mit dem Namen EventListeners habe, aber es scheint, dass es nicht einfach ist, bis zur Quelle des Ereignisses einen Drilldown durchzuführen, da jQuery umhüllt das Original

35
Eran Medan

Mit FireQuery - http://firequery.binaryage.com/ können Sie Ereignisse sehen, die an Elemente gebunden sind, und einen Drilldown durchführen

0
olore

Um den ersten angehängten Handler für das erste $ ("# button1") - Element zu erhalten

$._data($("#button1").get(0),"events").click[0].handler

JSFiddle

Die lange Geschichte, die niemand hören will:Ich bin hierher gekommen, um nach einem Plugin zu suchen. Ich war begeistert, @ schmidlops Antwort zu sehen, aber in jQuery ist das nicht der Fall Geben Sie mir den Listener, nach dem ich suche, es zeigt nur den generischen Handler für jQuery-Ereignisse, die schließlich den spezifischen Rückruf aufrufen. Ich bin immer noch auf der Suche nach einem Chrome-Plugin, mit dem ich mit der rechten Maustaste auf ein Element klicken und mich in die Handler hineinbohren kann an das Objekt angehängt.

Das wäre cool.

UPDATE: Ich habe eine Chrome-Erweiterung mit dem Namen jQuery Debugger gefunden. Sie müssen einfach "Inspect Element" auswählen und "jQuery Events" aus dem Untermenü "Elements" auswählen.https://chrome.google.com/webstore/detail/jquery-debugger/dbhhnnnpaeobfddmlalhnehgclcmjimienter image description here

31
Shanimal

Es gibt jetzt eine Registerkarte "Ereignislistener" in Chrome.Event Listeners tab

25
schmidlop

Wählen Sie im Chrome-Inspektor das Element auf der Registerkarte "Elemente" aus. Anschließend können Sie auf der Registerkarte "Konsole" die mit getEventListeners($0); verbundenen Ereignisse anzeigen.

19
Florent2

Die Firefox-Entwicklertools zeigen jetzt ein "ev" neben Elementen mit gebundenen Ereignissen an. Damit können gebundene Ereignisse (einschließlich jQuery-Ereignisse) untersucht werden.

Hier ein Beispiel für die Überprüfung des Elements "Erster Absatz" aus der jQuery-Klickdokumentation :

Bound events in Firefox developer tools

3
djsutho

Sie können auch das für Chrom verfügbare Visual Event-Addon überprüfen.

0
Gaurav M