2012-04-21 9 views
37

Estoy viendo el sitio de Bing Maps. Estoy abriendo el mi editor de lugares y haciendo clic en herramienta de polilínea en la barra de herramientas del dibujo.¿Cómo averiguo qué javascript se ejecuta cuando hago clic en un elemento?

Me gustaría descubrir qué es lo que javascript ejecuta cuando hago clic en las herramientas en la barra de herramientas de dibujo.

He mirado el html y no hay ningún evento onclick declarado en el elemento.

He realizado búsquedas de texto en todos los scripts a los que hace referencia la página, para el ID del elemento de la herramienta de la polilínea. Esto fue para tratar de encontrar javascript que adjunte un evento de clic al elemento, pero no obtuve ninguna coincidencia.

Debe haber alguna secuencia de comandos ejecutándose cuando hago clic en una herramienta. ¿Cómo averiguo qué secuencia de comandos se está ejecutando cuando hago clic en las herramientas divs en la barra de herramientas?

No creo que haya ningún modo en que pueda establecer puntos de interrupción si no sé primero en qué secuencia de comandos configurarlos. ¿Hay alguna forma de que pueda atrapar el javascript que se ejecuta para descubrir qué es, ya sea en las herramientas de desarrollo IE F12 o en Firebug?

+2

En incendiario, puede hacer clic en el botón de "pausa". Luego, haz clic donde quieras. El botón "pausa" hará que la depuración se detenga tan pronto como js esté haciendo algo. –

+0

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

+2

Hay una sección de "escuchas de eventos" en las herramientas de desarrollo de Chrome, al menos. Tal vez IE también los tiene, o simplemente puedes verificarlo en Chrome. Está debajo del panel que muestra las propiedades de CSS. –

Respuesta

47

Puede echar un vistazo al panel "Escucha de eventos" en Chrome, que tiene información detallada sobre cada oyente unido a un elemento.

enter image description here

+0

Gracias GGG, he hecho esto y puedo ver el cuerpo del oyente, pero el número de línea es incorrecto, creo (dice que la línea 1 parece estar equivocada). El archivo javascript se ha modificado y está en una línea, así que supongo que ese es el motivo. ¿Hay alguna forma de que pueda descubrir el nombre de la función del oyente? ¿O encuentra el número de línea correcto? –

+1

Seguro que sí. Busque la secuencia de comandos en la pestaña "Recursos" del inspector (debe poder acceder desde el panel Oyentes de eventos) y observe la parte inferior de la ventana. Cerca de donde está la lupa en la captura de pantalla de arriba, verás un botón que se ve así: '{}'. Haga clic en eso, es un botón bastante impresión. Ahora mira hacia atrás en el panel de Escucha de eventos, utilizará los nuevos números de línea del código bonito impreso. –

+0

¿Te refieres a la pestaña "Guiones"? Veo un botón de impresión bonito '{}' en la pestaña "Guiones" pero no en la pestaña "Recursos". En realidad, ya había intentado formatear el script con este botón en la pestaña "Scripts", pero el número de línea en el panel "Event Listeners" no se actualizó. ¿Alguna idea sobre cómo actualizarlo? Gracias –

1

Abra su depurador e inicie el generador de perfiles. Haga clic en lo que quiera. Mira lo que el generador de perfiles y ver lo que se llamaba.

+1

Interesante, pero eso produce un revoltijo de más de 50 entradas de profiler cuando estoy buscando la función 'toggle()' al hacer clic en el botón maximizar en la esquina superior derecha de [esta página] (http: // wiki. dandascalescu.com/reviews/online_services/customer_and_project_management_systems). –

3

para localizar un potencial manipulador caso para un elemento particular que se ha añadido dinámicamente Trate de realizar una búsqueda en todas las fuentes de nombres de las clases y los identificadores de . Una vez que haya encontrado un controlador de eventos, puede establecer un punto de interrupción y verificar.

Google Chrome tiene una búsqueda global que funciona muy bien.

10

En Herramientas para desarrolladores de Chrome, haga clic en la pestaña de la línea de tiempo, desmarque "Cargando" y "Representación", luego haga clic en el botón de grabación (círculo relleno). Dispare su evento haciendo clic en el botón y luego pare la grabación haciendo clic en el círculo nuevamente. Encuentre su evento en la línea de tiempo y amplíelo haciendo clic en la flecha al lado. A la izquierda, te dirá qué función llamó el evento.

3

He utilizado el Analizador en las herramientas de depuración de Chrome para este fin antes.

Abra el sitio en Chrome, F12 para abrir la herramienta de depuración. En las pestañas en la parte superior de la herramienta, haga clic en Perfiles.

Asegúrate de que se ha seleccionado Recoger el perfil de CPU de JavaScript, y presiona Inicio, luego haz clic en la herramienta de la polilínea que te interese y presiona Parar. El generador de perfiles ahora debería enumerar todas las llamadas de Javascript realizadas mientras el generador de perfiles estaba activo.

Firebug probablemente tenga algo similar.

Cuestiones relacionadas