javascript - chrome怎样查看为一个元素绑定的事件?
大家讲道理
大家讲道理 2017-04-10 15:22:23
[JavaScript讨论组]

在看umeditor的代码,鼠标放上去有相应的响应,但是不知道在哪里绑定的事件,chrome这里,却显示什么jquery,应该是用jquery绑定的事件,但不是绑定事件最开始的地方,没什么实际用处,能不能查看实际在哪里绑定的事件呢?

大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回复(8)
伊谢尔伦

1 chrome自带,Event Listeners, 选择 Select Node Only

2 chrome控制台输入 getEventListeners(node)

现在看,有意义了!

黄舟

我想说, 这个是做不到的。
chrome只记录了绑定事件的代码,因为你的页面是使用jquery的事件进行绑定的, 所以都是jquery的方法。
不过你可以这样去调试:


在【source】面板中勾选 click事件(以click为例)。 然后操作在页面中触发click事件。
然后 断点会进入到jquery的某一个方法中, 按F11逐行调试, 直到进入你写的业务代码。

天蓬老师

直接用火狐 ==》查看页面元素==》元素旁边的e 标志点开==》就能找到改元素上绑定的事件方法了(包括系统的和你自定义的)

大家讲道理

chrome有个插件Visual Event:
https://chrome.google.com/webstore/detail/visual-event/pbmmieigblcbldg...

迷茫

Chrome 下在Elements选中你要查看的DOM节点后,在控制台输入:

$._data($0).handle      //这种方式依赖于jQuery

只供参考,有时候获取到的函数并没有实际价值

阿神

you need firefox

找到你想要查看的事件绑定元素。然后 右键-》“查看元素” 然后 在查看器 里面 就会看到(灰色方块 中间字母为“ev”) 点击 该按钮
就能看到该控件具体的JS了

PHPz

jQuery

php$._data($('#element').get(0));//右键显示函数定义
迷茫

chrome plug-in Visual Event:

<a id="backtop" class="border-bottom" href="#">回顶部</a>

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号