2012-04-21 9 views
37

Sto guardando il sito Bing Maps. Sto aprendo l'editor dei posti e facendo clic sullo strumento polilinea nella barra degli strumenti del disegno.Come faccio a sapere che cosa javascript viene eseguito quando faccio clic su un elemento?

Vorrei scoprire che cosa javascript viene eseguito quando faccio clic sugli strumenti nella barra degli strumenti del disegno.

Ho visto l'html e non c'è nessun evento onclick dichiarato sull'elemento.

Ho effettuato ricerche di testo su tutti gli script a cui fa riferimento la pagina, per l'ID dell'elemento dello strumento polilinea. Questo è stato per cercare di trovare javascript che allega un evento click all'elemento, ma non ho avuto alcuna corrispondenza.

Ci deve essere uno script in esecuzione quando faccio clic su uno strumento. Come faccio a sapere che cosa sta eseguendo lo script quando faccio clic sugli strumenti div nella barra degli strumenti?

Non credo che sia comunque possibile impostare i punti di interruzione se non conosco per primo lo script su cui impostarli. È comunque possibile intercettare il javascript che viene eseguito per scoprire di cosa si tratta, sia negli strumenti di sviluppo di IE F12 che in Firebug?

+2

In Firebug, è possibile fare clic sul pulsante "pausa". Quindi, fai clic dove vuoi. Il pulsante "pausa" farà sì che il debug si fermi non appena js sta facendo qualcosa. –

+0

Correlati: http://stackoverflow.com/questions/446892 –

+2

Esiste una sezione "listener di eventi" negli strumenti per sviluppatori di Chrome, almeno. Forse anche IE li ha o potresti semplicemente controllarlo in Chrome. È sotto il pannello che mostra le proprietà CSS. –

risposta

47

Puoi dare un'occhiata al pannello "Listener di eventi" in Chrome, contiene informazioni dettagliate su ciascun listener collegato a un elemento.

enter image description here

+0

Grazie GGG, ho fatto questo e posso vedere l'ascoltatoreBody, ma il numero di riga è errato, credo (dice la riga 1 che sembra essere sbagliato). Il file javascript è stato minimizzato e si trova tutto su una riga quindi immagino che sia la ragione. C'è un modo per scoprire il nome della funzione listener? O trovare il numero di linea corretto? –

+1

Ci sono sicuro. Trova lo script nella scheda "Risorse" dell'ispettore (dovresti essere in grado di arrivarci dal pannello Ascoltatori di eventi) e guardare nella parte inferiore della finestra. Vicino a dove si trova la lente d'ingrandimento nello screenshot in alto, vedrai un pulsante simile a questo: '{}'. Fare clic su questo, è un pulsante abbastanza bello. Ora guarda indietro al pannello Event Listeners, userà i nuovi numeri di linea dal codice piuttosto stampato. –

+0

Intendi la scheda "Script"? Vedo un bel pulsante di stampa '{}' sotto la scheda "Script" ma non la scheda "Risorse". In realtà, avevo già provato a formattare lo script con questo pulsante nella scheda "Script" ma il numero di riga nel pannello "Listener eventi" non si aggiornava. Qualche idea su come farlo aggiornare? Grazie –

1

Apri il tuo debugger e avvia il profiler. Clicca su quello che vuoi. Guarda cosa è il profiler e guarda cosa è stato chiamato.

+1

Interessante, ma che produce un guazzabuglio di oltre 50 voci di profiler quando cerco la funzione 'toggle()' quando si fa clic sul pulsante di ingrandimento nell'angolo in alto a destra di [questa pagina] (http: // wiki. dandascalescu.com/reviews/online_services/customer_and_project_management_systems). –

3

per individuare un potenziale gestore eventi per un particolare elemento che è stato aggiunto in modo dinamico provare a eseguire una ricerca in tutte le fonti di classnames e ids. Una volta trovato un gestore di eventi, puoi impostare un punto di interruzione e verificare.

Google Chrome ha una ricerca globale che funziona alla grande.

10

In Strumenti sviluppatore di Chrome fare clic sulla scheda Timeline, deselezionare "Caricamento" e "Rendering", quindi fare clic sul pulsante di registrazione (cerchio pieno). Attiva il tuo evento facendo clic sul pulsante e quindi interrompi la registrazione facendo nuovamente clic sul cerchio. Trova il tuo evento nella timeline ed espanderlo facendo clic sulla freccia accanto. Sulla sinistra ti dirà quale funzione ha chiamato l'evento.

3

Ho usato il Profiler negli strumenti di debug di Chrome per questo scopo in precedenza.

Aprire il sito in Chrome, F12 per aprire lo strumento di debug. Nelle schede nella parte superiore dello strumento, fare clic su Profili.

Assicurati che Raccogli profilo CPU JavaScript sia selezionato, quindi fai clic su Start, quindi fai clic sullo strumento Polilinea che ti interessa e premi Arresta. Il profiler dovrebbe ora elencare tutte le chiamate Javascript effettuate mentre il profiler era attivo.

Firebug probabilmente ha qualcosa di simile.

Problemi correlati