在JavaScript中列出所有事件监听器是可能的:这并不难;你只需要破解HTML元素的原型方法(在添加侦听器之前)。

function reportIn(e){
    var a = this.lastListenerInfo[this.lastListenerInfo.length-1];
    console.log(a)
}


HTMLAnchorElement.prototype.realAddEventListener = HTMLAnchorElement.prototype.addEventListener;

HTMLAnchorElement.prototype.addEventListener = function(a,b,c){
    this.realAddEventListener(a,reportIn,c); 
    this.realAddEventListener(a,b,c); 
    if(!this.lastListenerInfo){  this.lastListenerInfo = new Array()};
    this.lastListenerInfo.push({a : a, b : b , c : c});
};

现在每个锚元素(a)都有一个lastListenerInfo属性，其中包含它所有的侦听器。它甚至可以用匿名函数删除侦听器。

这取决于事件是如何附加的。为了说明，假设我们有以下点击处理程序:

var handler = function() { alert('clicked!') };

我们将使用不同的方法将它附加到元素上，有些允许检查，有些不允许。

方法A)单个事件处理程序

element.onclick = handler;
// inspect
console.log(element.onclick); // "function() { alert('clicked!') }"

方法B)多个事件处理程序

if(element.addEventListener) { // DOM standard
    element.addEventListener('click', handler, false)
} else if(element.attachEvent) { // IE
    element.attachEvent('onclick', handler)
}
// cannot inspect element to find handlers

方法C): jQuery

$(element).click(handler);

1.3.x // inspect var clickEvents = $(element).data("events").click; jQuery.each(clickEvents, function(key, value) { console.log(value) // "function() { alert('clicked!') }" }) 1.4.x (stores the handler inside an object) // inspect var clickEvents = $(element).data("events").click; jQuery.each(clickEvents, function(key, handlerObj) { console.log(handlerObj.handler) // "function() { alert('clicked!') }" // also available: handlerObj.type, handlerObj.namespace }) 1.7+ (very nice) Made using knowledge from this comment. events = $._data(this, 'events'); for (type in events) { events[type].forEach(function (event) { console.log(event['handler']); }); }

(参见jQuery.fn.data和jQuery.data)

方法D):原型(凌乱)

$(element).observe('click', handler);

1.5.x // inspect Event.observers.each(function(item) { if(item[0] == element) { console.log(item[2]) // "function() { alert('clicked!') }" } }) 1.6 to 1.6.0.3, inclusive (got very difficult here) // inspect. "_eventId" is for < 1.6.0.3 while // "_prototypeEventID" was introduced in 1.6.0.3 var clickEvents = Event.cache[element._eventId || (element._prototypeEventID || [])[0]].click; clickEvents.each(function(wrapper){ console.log(wrapper.handler) // "function() { alert('clicked!') }" }) 1.6.1 (little better) // inspect var clickEvents = element.getStorage().get('prototype_event_registry').get('click'); clickEvents.each(function(wrapper){ console.log(wrapper.handler) // "function() { alert('clicked!') }" })

当单击控制台中的结果输出(其中显示了函数的文本)时，控制台将直接导航到相关JS文件中函数声明的行。

(重写这个问题的答案，因为它与这里有关。)

在调试时，如果你只想看到事件，我建议你选择…

视觉事件 Chrome开发者工具的元素部分:选择一个元素，在右下角寻找“事件监听器”(类似于Firefox)

如果你想在你的代码中使用事件，并且你在1.8版本之前使用jQuery，你可以使用:

$(selector).data("events")

来获取事件。从1.8版开始，停止使用.data("events")(请参阅此错误票据)。你可以使用:

$._data(element, "events")

另一个例子:将某个链接上的所有点击事件写入控制台:

var $myLink = $('a.myClass');
console.log($._data($myLink[0], "events").click);

(工作示例见http://jsfiddle.net/HmsQC/)

不幸的是，使用$。_data除了调试之外不建议使用，因为它是jQuery的内部结构，在未来的版本中可能会改变。不幸的是，我不知道其他方便的方法来访问这些事件。

Chrome, Firefox, Vivaldi和Safari在他们的开发人员工具控制台中支持getEventListeners(domElement)。

对于大多数调试目的，都可以使用这种方法。

下面是一个很好的使用它的参考: getEventListeners函数

Clifford Fajardo在评论中给出了高度投票的建议:

getEventListeners($0)将获得你在Chrome开发工具中关注的元素的事件监听器。

原型1.7.1方式

function get_element_registry(element) {
    var cache = Event.cache;
    if(element === window) return 0;
    if(typeof element._prototypeUID === 'undefined') {
        element._prototypeUID = Element.Storage.UID++;
    }
    var uid =  element._prototypeUID;           
    if(!cache[uid]) cache[uid] = {element: element};
    return cache[uid];
}

有很好的jQuery事件扩展:

(主题)