allega/eventi legati di un elemento che utilizzano strumenti di Chrome di sviluppo/Firebug/IE Developer Toolbar

Question

Ispezionando DOM di una pagina, vorrei conoscere l'evento in allegato (s) di un elemento rapidamente

Per esempio, se un pulsante ha questo HTML DOM

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

E da qualche parte (non in un posto che conosco in anticipo) ha un evento associato, ad esempio,

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

so che può essere fatto programatically (Can I find events bound on an element with jQuery?)

, ma c'è un modo utilizzando solo uno degli strumenti di sviluppo per Chrome/Firefox/IE per visualizzare un elenco di eventi?

---

Aggiornamento: ho scoperto che nelle versioni più recenti di Chrome ho una scheda denominata EventListeners ma sembra che non consente facile drill-down tutta la strada fino alla sorgente della manifestazione, come jQuery avvolge l'originale

Answer 1

FireQuery - http://firequery.binaryage.com/ ti permette di vedere gli eventi legati agli elementi e drill in loro

Answer 2

Con l'ispettore Chrome selezionare l'elemento nella scheda "elementi" e poi dalla scheda "Console" è possibile vedi th e eventi collegati all'elemento con getEventListeners($0);.

Answer 3

Ora c'è una scheda Listener di eventi in Chrome.

Answer 4

per ottenere il primo gestore allegata al primo $ ("# button1") elemento

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

JSFiddle

La lunga storia che nessuno vuole sentire: Sono venuto qui alla ricerca di un plugin. Ero entusiasta di vedere la risposta di @schmidlop, ma in jQuery che in realtà non mi dà l'ascoltatore che sto cercando, mostra semplicemente il gestore generico per gli eventi jQuery che alla fine chiamano il callback specifico. Sto ancora cercando un plugin per Chrome che mi permetta di fare clic con il tasto destro su un elemento e permettermi di eseguire il drill sui gestori collegati all'oggetto.

Perché sarebbe bello.

UPDATE: ho trovato un'estensione Chrome chiamata jQuery Debugger. È sufficiente "Inspect Element" e scegliere "jQuery Eventi" dal sottomenu "Elementi" ...https://chrome.google.com/webstore/detail/jquery-debugger/dbhhnnnpaeobfddmlalhnehgclcmjimi

Answer 5

strumenti per gli sviluppatori di Firefox ora visualizzano un "EV" accanto agli elementi che sono legati eventi. Questo può essere usato per ispezionare gli eventi associati (inclusi gli eventi jQuery).

Ecco un esempio di ispezionare l'elemento "Primo paragrafo" dalla jQuery click documentation:

Answer 6

È inoltre possibile controllare a vista addon eventi disponibili per Chrome.