我能找到绑定在jQuery元素上的事件吗？

Question

我能找到绑定在jQuery元素上的事件吗？我在这个链接上绑定了两个事件处理程序：<a href='#' id='elm'>Show Alert</a>JavaScript：$(function(){   $('#elm').click(_f);   $('#elm').mouseover(_m);});function _f(){alert('clicked');}function _m(){alert('mouse over');}是否有任何方法获取绑定在元素上的所有事件的列表，在本例中为on元素id="elm"?

Answer 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中，您可以右键单击处理程序函数，然后单击“查看函数定义”，以显示在代码中定义它的确切位置。

Answer 2

一般情况：

• 命中

  F12

  打开开发工具
• 单击

  Sources

  附签
• 在右边，向下滚动到

  Event Listener Breakpoints

  ，并扩展树
• 单击要侦听的事件。
• 与目标元素交互，如果它们触发，将在调试器中得到一个断点。

同样，你可以：

• 右键单击

  目标元素

  ->选择“

  Inspect element"

• 向下滚动到开发框架的右侧，底部是‘

  event listeners'.

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

Answer 3

现在，您可以使用javascript函数getEventListener()获得绑定到对象的事件侦听器列表。

例如，在dev工具控制台中键入以下内容：

// Get all event listners bound to the document objectgetEventListeners(document);