Dis que vous avez cette div: et vous faites ceci: quelque part dans votre code JavaScript. Une fois la page chargée, il existe un moyen de découvrir, via Firebug ou d'inspecter l'élément de chrome, ou autre chose, que l'événement de clic pour #foo est lié à quelque fonctionnement ? C'est-à-dire, trouvez ceci sans avoir à rechercher tout votre code?
4 Réponses :
Vous pouvez utiliser la console dans les outils de développement intégrés des navigateurs. Ils sont intégrés pour IE et Chrome tandis que FF aura besoin de l'addon Firebug installé. Je ne connais pas d'autres navigateurs.
Utilisation de la console de débogueur Vous pouvez utiliser les données JQuery exécuter ce qui précède dans la console affichera un objet avec une propriété pour chaque événement qu'il a trouvé. Dans votre exemple, il renvoie un objet avec Si vous avez des événements et que vous voulez juste cet objet, vous pouvez exécuter ce qui suit dans le CONSOLE: P> ("Evénements") CODE> pour interroger les événements ci-joints d'un élément. De plus, ces consoles vous permettent également de réduire de manière dynamique des détails supplémentaires des événements qui vous intéressent. P> cliquez sur la propriété CODE> Propriété de Type Array stockant tous les événements de clic. P> <div id="foo" onclick="...">bar</div>
Les outils de développeur chrome font cela.
Cela vous donnera une liste d'auditeurs d'événements sur l'objet pouvant être étendu pour trouver leur source et la fonction ci-jointe.
Firebug a cette information sous l'onglet DOM, mais il est moins convivial.
Lorsque je regarde le gestionnaire de clic, cela me pointe juste au code source JQuery. Devrais-je voir quelque chose d'autre où cela me montre où dans mon code source, j'ai utilisé JQuery pour définir le gestionnaire d'événements?
Bien que cela soit correct, cela vous permettra uniquement de visualiser la méthode JQuery Wrapper qui gère l'événement. Il est assez difficile de naviguer à partir de là au gestionnaire d'événements en utilisant des points de rupture. Ruidfigueiredo a écrit des JS qui vous aide à trouver le gestionnaire d'événements réel assez facilement. Vérifiez ici: github.com/ruidfigueiredo/findhandlersjs Vous pouvez coller le code de FindeventHandlers.js hétéro dans votre console. Pas besoin de créer une inclusion réelle.
Je ne sais pas sur Firefox, mais il y a un moyen facile de voir les auditeurs d'événements à Chrome et Safari. Ouvrez simplement les outils de développement, sélectionnez votre élément et faites défiler vers le bas du panneau Propriétés CSS. Vous trouverez une section "Auditeurs d'événements".
Ce n'est plus sous CSS, sur Chrome, il y a un onglet distinct "Soutiteurs d'événements", sur Safari, c'est sous l'onglet Node
Je suggérerais d'utiliser Voici le Description sur la façon de l'utiliser. Je l'utilise presque tous les jours et c'est un très bon outil. événement visuel 2 .
Nous utilisons également des événements visuels 2, mais il a des problèmes qui tentent d'afficher des scripts attachés au contenu chargé de manière dynamique.
Dupliquer possible de Stackoverflow.com/Questtions/570960/...
Cette question et sa réponse acceptée sont spécifiques à JQuery.