Ich habe ein anpassbares Formularelement auf einer Seite aus einer Bibliothek. Ich möchte sehen, welche Javascript-Ereignisse ausgelöst werden, wenn ich mit ihnen interagiere, weil ich herausfinden möchte, welcher Ereignishandler verwendet werden soll.
Wie mache ich das mit Chrome Web Developer?
javascript
google-chrome-devtools
John Hoffman
quelle
quelle
Antworten:
Ebenso können Sie mit der rechten Maustaste auf das Zielelement klicken -> "Element untersuchen" auswählen. Scrollen Sie auf der rechten Seite des Entwicklungsrahmens nach unten. Unten befindet sich "Ereignis-Listener". Erweitern Sie den Baum, um zu sehen, welche Ereignisse an das Element angehängt sind. Ich bin mir nicht sicher, ob dies für Ereignisse funktioniert, die durch Sprudeln behandelt werden (ich vermute nicht).
quelle
Sie können die Funktion monitorEvents verwenden.
Überprüfen Sie einfach Ihr Element (
right mouse click
→Inspect
auf dem sichtbaren Element oder gehen SieElements
in den Chrome Developer Tools zur Registerkarte und wählen Sie das gewünschte Element aus). Gehen Sie dann zurConsole
Registerkarte und schreiben Sie:Wenn Sie nun mit der Maus über dieses Element fahren, es fokussieren oder darauf klicken, wird der Name des ausgelösten Ereignisses mit seinen Daten angezeigt.
Um diese Daten nicht mehr abzurufen, schreiben Sie dies einfach in die Konsole:
$0
ist nur das letzte von den Chrome Developer Tools ausgewählte DOM-Element. Sie können dort jedes andere DOM-Objekt übergeben (z. B. Ergebnis vongetElementById
oderquerySelector
).Sie können auch den Ereignistyp "Typ" als zweiten Parameter angeben, um überwachte Ereignisse auf einen vordefinierten Satz zu beschränken. Zum Beispiel:
Eine Liste dieser verfügbaren Typen finden Sie hier .
Ich habe ein kleines GIF erstellt, das zeigt, wie diese Funktion funktioniert:
quelle
MouseEvent
soll ich suchen?Visual Event ist ein nettes kleines Lesezeichen, mit dem Sie die Ereignishandler eines Elements anzeigen können. Die Online-Demo kann hier angesehen werden .
quelle
Für jQuery (mindestens Version 1.11.2) hat das folgende Verfahren für mich funktioniert.
$._data(($0), 'events');
die 'Konsole' einhandler:
Wert.Und es ist Zeit aufzuhören, das Rad neu zu erfinden und Vanilla JS-Events zu verwenden ... :)
quelle
Dies zeigt keine benutzerdefinierten Ereignisse an, wie sie Ihr Skript möglicherweise erstellt, wenn es sich um ein JQuery-Plugin handelt. beispielsweise :
Das Ereignisfenster unter "Skripte" in Chrome-Entwicklertools zeigt nicht "Etwas: Benutzerdefiniertes Ereignis Eins" an.
quelle