Javascript Debugging - Wie man auf alle unbekannten Klickereignisse einbricht

Question

Also habe ich ein jQuery mobiles Projekt und um (die meisten) Popups zu schließen, bemerkte ich, dass ich zweimal in einem anderen Bereich als dem Popup klicken muss. In diesen Fällen scheint der erste Klick die #&ui-state=dialog aus der URL-Adressleiste zu entfernen, während die zweite das Popup tatsächlich entfernt.

Ich habe für mehrere Includes der gleichen JS-Datei überprüft und es gibt nur ein Vorkommen beim Anzeigen der Quelle. Ich aktualisiere die Seite direkt, so dass auch keine zweite Aufnahme der JS-Datei aus der Navigation möglich ist. Soweit ich das beurteilen kann (und ich bin mir ziemlich sicher), gibt es nicht mehrere benutzerdefinierte Klickereignisse, die an die Schaltfläche gebunden sind, die das Popup-Fenster auslösen (vielleicht jQuery Mobile im Hintergrund, aber nicht benutzerdefiniert).

Gibt es eine Möglichkeit für mich, im Wesentlichen auf alle Klickereignisse als Teil des Debuggens zu warten und zu sehen, was mit ihnen passiert? Ich habe Pausen zum benutzerdefinierten JS-Code hinzugefügt, der das Popup öffnet, und es wird nur einmal ausgeführt. Aber da ist mehr los und ich weiß nicht, woher es kommt oder wie ich es finden kann.

Answer 1

Sie könnten die addEventListener method hijack, die Ihnen die Möglichkeit geben würde zu wissen, wann ein Ereignis registriert ist und sogar reagieren auf dieses Ereignis.

var oldAddEventListener = EventTarget.prototype.addEventListener; 
EventTarget.prototype.addEventListener = function(cb) { 
    var customCB = function() { 
    console.log('Hijacked event handler'); 
    return cb.apply(this, arguments); 
    }; 

    console.log('Hijacked add event listener'); 
    return oldAddEventListener.apply(this, arguments); 
}; 

Wenn Sie jedes Ereignis aufnehmen möchten, stellen Sie sicher, dass Sie vor jedem anderen zusätzlichen Code in diesem Code laden.

Dies funktioniert, weil Element erbt addEventListener von EventTarget. Durch das Überschreiben dieser Methode im Prototyp wird sichergestellt, dass alle Element Ihre benutzerdefinierte Methode beim Anhängen eines Ereignis-Listeners verwenden.