当前位置:  开发笔记 > 编程语言 > 正文

我可以使用jQuery查找绑定在元素上的事件吗?

如何解决《我可以使用jQuery查找绑定在元素上的事件吗?》经验,为你挑选了5个好方法。

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

Show Alert

JavaScript的:

$(function()
{
  $('#elm').click(_f);
  $('#elm').mouseover(_m);
});

function _f(){alert('clicked');}
function _m(){alert('mouse over');}

有没有办法得到一个元素绑定的所有事件的列表,在这种情况下元素与id="elm"



1> Sampson..:

在现代版本的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中,您可以右键单击处理程序函数并单击"查看函数定义"以显示代码中定义它的确切位置.


这仅适用于通过jQuery帮助程序绑定的元素.
这些天必须使用:$ ._ data($('#foo')[0]).events
@marcus ahhh,woops我错过了什么,对不起:)`$ ._ data(element [0],'events');`
`$._data()` is used by JQuery internal. `$.data()` is the public method to user. And `$.data(element, 'events')` works fine.
@jammypeach我正在尝试你的解决方案,但仍然为选择器返回undefined.我用$('#elem').bind('click',function(){}); 如果这会有所作为.
`TypeError:$ ._ data不是函数`(函数($){$ ._ data($('#edit-search-block-form - 2'),"events");})(jQuery);
我不禁想到"现代"会变得越来越亲戚,当然最终可能会过时 - 我们可以获得版本号吗?

2> Vali Shah..:

一般情况:

点击F12打开Dev Tools

单击Sources选项卡

在右侧,向下滚动Event Listener Breakpoints并展开树

单击要收听的事件.

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

同样,您可以:

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

向下滚动到开发框架的右侧,底部是' event listeners'.

展开树以查看附加到元素的事件.不确定这是否适用于通过冒泡处理的事件(我猜不是)


我同意这是首选的方法,并且是一种通用的解决方案,而不是依赖于jQuery,它可能有也可能不可用.
@dead嗯...这个问题特指jQuery并在示例附件中使用jQuery - 答案应该只在jQuery(?)的上下文中有效
在其他环境中理解答案也很有帮助.仅仅因为某人提出具体问题并不意味着他们将获得的有限答案是最好的答案.特别是对于jQuery,人们往往依赖它作为拐杖.理解底层架构很重要.这个答案表明jQuery甚至不一定是必需的.问题和例子太模糊,无法了解其用法,因此可以解释可以被视为有效答案的内容.

3> kakoma..:

我正在为后代添加这个; 有一种更简单的方法,不涉及编写更多的JS.使用惊人的firebug插件for firefox,

    右键单击元素并选择"使用Firebug检查元素"

    在侧边栏面板中(如屏幕截图所示),使用tiny>箭头导航到events选项卡

    "事件"选项卡显示每个事件的事件和相应的功能

    它旁边的文字显示了功能位置

在此输入图像描述



4> ScottyG..:

现在,您可以使用javascript函数getEventListeners()简单地获取绑定到对象的事件侦听器列表.

例如,在开发工具控制台中键入以下内容:

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


我认为这不是本机函数,需要以下脚本/依赖项:https://github.com/colxi/getEventListeners应该将其添加到答案中,否则会引起误解。但是,感谢您让我使用“插件”;看起来不错。:)

5> JohnK..:

在jQuery的审计插件插件应该让你通过正常的Chrome浏览器开发工具做到这一点.它并不完美,但它应该让你看到绑定到元素/事件的实际处理程序,而不仅仅是通用的jQuery处理程序.

推荐阅读
跟我搞对象吧
这个屌丝很懒,什么也没留下!
DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6
Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved devBox.cn 开发工具箱 版权所有