如何在ChromeDevTools中查看在元素上激发的事件？
我在库中的页面上有一个可自定义的表单元素。我希望看到在与javascript交互时触发了哪些javascript事件，因为我试图找出要使用的事件处理程序。
我如何使用ChromeWebDeveloper做到这一点？
共有3个答案
VisualEvent是一个很好的小书签，可以用来查看元素的事件处理程序。在线演示可以在这里查看。
您可以使用monitorEvents功能。
只需检查您的元素（鼠标右键单击→检查可见元素上的或转到Chrome开发人员工具中的元素选项卡并选择所需元素），然后转到控制台选项卡并写：
monitorEvents($0)
现在，当您将鼠标移到该元素上，聚焦或单击它时，将显示激发事件的名称及其数据。
要停止获取此数据，只需将此写入控制台：
unmonitorEvents($0)
$0只是Chrome开发者工具选择的最后一个DOM元素。您可以在那里传递任何其他DOM对象（例如getElementById或querySelector的结果）。
您还可以指定事件“类型”作为第二个参数，以将监视的事件缩小到某个预定义的集合。例如：
monitorEvents(document.body, 'mouse')
此可用类型的列表位于此处。
我制作了一个小gif，演示了此功能的工作原理：
- 点击F12打开开发工具
- 单击来源选项卡
- 在右侧，向下滚动到事件监听器断点，并展开树
- 点击您要收听的事件。
- 与目标元素交互，如果他们触发，你会在调试器中得到一个断点
类似地，您可以右键单击目标元素-
-
问题内容： 我在库的页面上有一个可自定义的表单元素。我想查看与之交互时触发了哪些javascript事件，因为我试图找出要使用的事件处理程序。 如何使用Chrome Web Developer做到这一点？ 问题答案： 点击打开开发工具 点击来源标签 在右侧，向下滚动到“事件侦听器断点”，然后展开树 单击您想听的事件。 与目标元素进行交互，如果它们触发，您将在调试器中得到一个断点 同样，您可以右键单
-
我有以下HTML结构，并将dragenter和dragleave事件附加到
-
本文向大家介绍如何检查jQuery中的元素上是否存在事件？，包括了如何检查jQuery中的元素上是否存在事件？的使用技巧和注意事项，需要的朋友参考一下 要检查jQuery中元素上是否存在事件，请检查元素上是否存在现有事件。 在这里，我设置了div- 当您单击div时，警报将生成使用div ID设置的警报： 您可以尝试运行以下代码来检查事件是否存在- 示例
-
问题内容： 我在我的Web应用程序中同时使用了Bootstrap和AngularJS。我很难让两个人一起工作。 我有一个元素，它具有属性 我想在用户在字段中输入时更新属性。该函数已正确触发，但是除非我使用，这是jQuery方式，而不是AngularJS方式，否则我无法访问触发事件的元素。 使AngularJS与旧式JS模块一起工作的最佳方法是什么。 问题答案： 不会将DOM元素传递给函数。这里将参
-
问题内容： 有没有一种方法可以检查jQuery中是否存在事件？我正在使用自定义命名空间事件的插件，并且希望能够检查事件是否绑定到元素。 问题答案： $(‘body’).click(function(){ alert(‘test’ )}) 您可以通过将对象引用（虽然不是jQuery对象）馈送到$.data进行检查，并为第二个参数馈送“事件”，这将返回一个填充有所有事件（例如“点击”）的对象。您可以遍
-
我不能得到子元素。 我可以用appium inspector看到childNameTV元素下的childNameLabel元素 例如，我尝试查找第一个子元素的文本；