Javascript 在Chrome开发者工具（或类似工具）中调试时，如何查找给定范围内的所有jQuery事件

如果您添加了jQuery事件，例如：

$（元素）。单击（函数（）{
调试器；
//一些代码
});

在使用断点或使用控制台时，您找不到click event by（在或类似版本中），例如：

console.log（元素）；

但是，我发现，如果执行以下操作，可以找到元素的事件：

//查找范围内标记的所有事件
//id为“container”的HTML元素。
var elementsToFindEventsFor=$（“img”，$（“容器”）；
var事件=[]；
$（elementsToFindEventsFor）.每个（函数（i，元素）{
事件推送（$.\u数据（元素，“事件”）；
});
console.log（事件）；

jsFiddle：

这使您能够在调试时浏览返回元素上的事件，但编写5行代码进行调试并不十分方便

因此，我很好奇，是否有任何更可读、更易于编写的jQueryAPI解决方案是我找不到的

另见：

---

Allan Jardine为此编写了一个优秀的书签：

VisualEvent是一个开源Javascript bookmarklet，它提供有关已附加到DOM元素的事件的调试信息。视觉事件显示：

• 哪些元素附加了事件
• 附加到元素的事件类型
• 将与事件一起运行的代码被触发
• 定义附加函数的源文件和行号（仅限Webkit浏览器和Opera）

除了有助于调试自己的代码外，VisualEvent还可以用作一种教育工具，显示编写了多少个网站

VisualEvent是一款开源软件（GPLv2），它托管了一个GitRepo，您可以根据自己的意愿进行分叉和修改

检查这个

我在每个图像中添加了两个事件，单击和鼠标输入

您需要传递事件参数（本例中为e）以获取所选元素的属性

如果在调试器（）函数命中时将调试点放置在该函数上，则使用Chrome Developer工具。。您可以将鼠标悬停在e参数上，其中有一个名为handleObj的属性。。如果单击，则可以看到调用函数的事件类型

---

您还可以在type属性中找到当前对象的信息

虽然您的答案可能是一个解决方案，但请记住“始终引用重要链接中最相关的部分，以防无法访问目标站点或永久脱机。”：据我所知，此解决方案可以在不使用太多代码的情况下查看事件，但从您的文本来看，它似乎仅在实际事件范围内可行，而且只有当您添加了

e

参数时，它看起来不像是一个一致的解决方案。如果我错了，请详细说明在您不知道要访问哪些事件，和/或自己没有编写事件代码，而您只想查找事件的情况下，这是如何解决问题的。哦，请不要使用“警报”进行调试；改用

console.log（例如，type，“类型属性中的当前事件”）

。