我在此链接上绑定了两个事件处理程序:

Show Alert
JavaScript:
$(function()
{
$('#elm').click(_f);
$('#elm').mouseover(_m);
});
function _f(){alert('clicked');}
function _m(){alert('mouse over');}

有什么方法可以获取绑定在元素上的所有事件的列表,在本例中是元素?

#1楼

在现代版本的jQuery中,您将使用$._data方法查找jQuery附加到相关元素的任何事件。 注意 ,这是仅供内部使用的方法:

// Bind up a couple of event handlers
$("#foo").on({
click: function(){ alert("Hello") },
mouseout: function(){ alert("World") }
});
// Lookup events for this particular Element
$._data( $("#foo")[0], "events" );

$._data的结果将是一个包含我们设置的两个事件的对象(如下图所示,其中的mouseout属性已展开):

然后,在Chrome中,您可以右键单击处理函数,然后单击“查看函数定义”,以向您显示在代码中定义的确切位置。

#2楼

当我像这样向$ ._ data传递一个稍微复杂的DOM查询: $._data($('#outerWrap .innerWrap ul li:last a'), 'events')它将在浏览器控制台中引发未定义。

因此,我必须在父div上使用$ ._ data: $._data($('#outerWrap')[0], 'events')来查看a标签的事件。 这是相同的JSFiddle: http : //jsfiddle.net/giri_jeedigunta/MLcpT/4/

#3楼

jQuery Audit插件插件应可让您通过常规的Chrome开发工具进行此操作。 它不是完美的,但是它应该让您看到绑定到元素/事件的实际处理程序,而不仅仅是通用jQuery处理程序。

#4楼

我用过类似的东西if($ ._ data($(“” a.wine-item-link“)[0])。events == null){...做一些事情,再次将它们的事件处理程序再次绑定}检查如果我的元素绑定到任何事件。 如果您已从该元素取消附加所有事件处理程序,它将仍然显示未定义(空)。 这就是为什么我在if表达式中对此进行评估的原因。

#5楼

一般情况:

点击F12打开开发工具

点击Sources标签

在右侧,向下滚动到Event Listener Breakpoints ,然后展开树

单击您想听的事件。

与目标元素进行交互,如果它们触发,您将在调试器中得到一个断点

同样,您可以:

右键单击目标元素 ->选择“ Inspect element ”

在开发框架的右侧向下滚动,在底部是“ event listeners ”。

展开树以查看将哪些事件附加到元素。 不知道这是否适用于通过冒泡处理的事件(我猜不是)