Получить прослушиватели событий, прикрепленные к node, с помощью addEventListener

Ответ 1

Chrome DevTools, Safari Inspector и Firebug поддерживают getEventListeners (node).

Ответ 2

Вы не можете.

Единственный способ получить список всех прослушивателей событий, подключенных к node, - это перехватить вызов приложения прослушивателя.

DOM4 addEventListener

Говорит

Добавить прослушиватель событий в соответствующий список прослушивателей событий с типом, установленным для типа, слушателем, установленным на слушателя, и набором захвата для захвата, если в этом списке уже нет слушателя событий с тем же типом, слушателем и захватом.

Значение, что прослушиватель событий добавляется в "список прослушивателей событий". Все это. Нет понятия, какой должен быть этот список, и как вы должны получить к нему доступ.

Ответ 3

Так как нет никакого естественного способа сделать это, здесь менее навязчивое решение, которое я нашел (не добавляйте никаких "старых" прототипов):

var ListenerTracker=new function(){
    var is_active=false;
    // listener tracking datas
    var _elements_  =[];
    var _listeners_ =[];
    this.init=function(){
        if(!is_active){//avoid duplicate call
            intercep_events_listeners();
        }
        is_active=true;
    };
    // register individual element an returns its corresponding listeners
    var register_element=function(element){
        if(_elements_.indexOf(element)==-1){
            // NB : split by useCapture to make listener easier to find when removing
            var elt_listeners=[{/*useCapture=false*/},{/*useCapture=true*/}];
            _elements_.push(element);
            _listeners_.push(elt_listeners);
        }
        return _listeners_[_elements_.indexOf(element)];
    };
    var intercep_events_listeners = function(){
        // backup overrided methods
        var _super_={
            "addEventListener"      : HTMLElement.prototype.addEventListener,
            "removeEventListener"   : HTMLElement.prototype.removeEventListener
        };

        Element.prototype["addEventListener"]=function(type, listener, useCapture){
            var listeners=register_element(this);
            // add event before to avoid registering if an error is thrown
            _super_["addEventListener"].apply(this,arguments);
            // adapt to 'elt_listeners' index
            useCapture=useCapture?1:0;

            if(!listeners[useCapture][type])listeners[useCapture][type]=[];
            listeners[useCapture][type].push(listener);
        };
        Element.prototype["removeEventListener"]=function(type, listener, useCapture){
            var listeners=register_element(this);
            // add event before to avoid registering if an error is thrown
            _super_["removeEventListener"].apply(this,arguments);
            // adapt to 'elt_listeners' index
            useCapture=useCapture?1:0;
            if(!listeners[useCapture][type])return;
            var lid = listeners[useCapture][type].indexOf(listener);
            if(lid>-1)listeners[useCapture][type].splice(lid,1);
        };
        Element.prototype["getEventListeners"]=function(type){
            var listeners=register_element(this);
            // convert to listener datas list
            var result=[];
            for(var useCapture=0,list;list=listeners[useCapture];useCapture++){
                if(typeof(type)=="string"){// filtered by type
                    if(list[type]){
                        for(var id in list[type]){
                            result.push({"type":type,"listener":list[type][id],"useCapture":!!useCapture});
                        }
                    }
                }else{// all
                    for(var _type in list){
                        for(var id in list[_type]){
                            result.push({"type":_type,"listener":list[_type][id],"useCapture":!!useCapture});
                        }
                    }
                }
            }
            return result;
        };
    };
}();
ListenerTracker.init();

Ответ 4

Вы можете получить все события jQuery, используя $._ data ($ ('[selector]') [0], 'events'); измените [селектор] на то, что вам нужно.

Существует плагин, который собирает все события, связанные с jQuery, называемые eventReport.

Также я пишу свой собственный плагин, который делает это с лучшим форматированием.

Но в любом случае кажется, что мы не можем собирать события, добавленные методом addEventListener. Может быть, мы можем обернуть вызов addEventListener для хранения событий, добавленных после нашего вызова на перенос.

Кажется, лучший способ увидеть события, добавленные в элемент с инструментами dev.

Но вы не увидите делегированных событий. Итак, нам нужны jQuery eventsReport.

ОБНОВЛЕНИЕ: ТЕПЕРЬ Мы можем видеть события, добавленные методом addEventListener. ВИДЕТЬ ПРАВО ОТВЕТ НА ЭТО ВОПРОС.

Ответ 5

Я не могу найти способ сделать это с помощью кода, но в Firefox 64 события перечислены рядом с каждой сущностью HTML в Инспекторе инструментов разработчика, как указано на странице Прослушиватели событий MDN Examine Event и как показано на этом рисунке: