jquery - 使用 jQuery 访问绑定到事件处理程序的函数

Question

.bind()使用 jQuery，您可以使用事件处理程序辅助函数之一将函数绑定到在 DOM 对象上触发的事件。

jQuery 必须以某种方式在内部存储它，我想知道是否有可能给定一个 DOM 对象，找出哪些事件已绑定到该对象，并访问这些函数等。所需的返回结果可能如下所示：

{
  click: [function1, function2],
  change: [function3],
  blur: [function4, function5, function6]
}

Answer 1

jQuery 1.7 已停止在常规 data() 函数中公开事件。你仍然可以像这样得到它们：

var elem = $('#someid')[0];
var data = jQuery.hasData( elem ) && jQuery._data( elem );
console.log(data.events);

请注意，这只适用于使用 jQuery 绑定的事件。AFAIK，您无法查看使用常规 DOM 函数（如 addEventListener）绑定的所有事件。

不过，您可以在 webkit 检查器中看到它们：在 Elements 选项卡中导航到所需的 DOM 节点，在右侧选择“Event Listeners”下拉菜单。

Answer 2

编辑：下面的方法仅适用于 jQuery < 1.7

你可以在这篇文章中找到很多有趣的提示和技巧：关于 jQuery 你可能不知道的事情。

似乎 jQuery 用于data存储事件处理程序：

您可以通过 jQuery 的事件存储访问绑定到元素（或任何对象）的所有事件处理程序：

// List bound events:
console.dir( jQuery('#elem').data('events') );

// Log ALL handlers for ALL events:
jQuery.each($('#elem').data('events'), function(i, event){
    jQuery.each(event, function(i, handler){
        console.log( handler['handler'].toString() );
    });
});

// You can see the actual functions which will occur
// on certain events; great for debugging!