如何找出触发了哪些JavaScript事件?

我只是想补充一句,你也可以在Chrome中做到这一点:

+ 班次 我 (开发人员工具)>源代码>事件侦听器断点(右侧)。

您还可以查看所有已经附加的事件,只需右键单击元素,然后浏览其属性(右侧的面板)。

例如:

不知道它是否和firebug选项一样强大,但已经足够我的大部分东西了。

另一个稍有不同但出人意料的很棒的选项是视觉事件: http://www.sprymedia.co.uk/article/Visual+Event+2

它突出显示页面上已绑定的所有元素,并具有显示所调用函数的弹出窗口。很漂亮的书签!还有一个Chrome插件,如果这是你的东西-不确定其他浏览器。

AnonymousAndrew monitorEvents(window); here

Firebug (Firefox插件)的答案是:

• 开放式萤火虫
• 右键单击HTML选项卡中的元素
• Log Events
• 启用控制台选项卡
• 在控制台选项卡中单击“持久化”(否则,重新加载页面后,控制台选项卡将清除)
• 选择 Closed

• 在控制台选项卡中会出现如下内容:

  ...
  mousemove clientX=1097, clientY=292
  popupshowing
  mousedown clientX=1097, clientY=292
  focus
  mouseup clientX=1097, clientY=292
  click clientX=1097, clientY=292
  mousemove clientX=1096, clientY=293
  ...
  

Firebug Tip: Log Events

关于Chrome,通过命令行API签出monitoreports()。

• 通过菜单>工具>JavaScript控制台打开控制台。

• 输入 monitorEvents(window);

• 查看充满事件的控制台

   ...
   mousemove MouseEvent {dataTransfer: ...}
   mouseout MouseEvent {dataTransfer: ...}
   mouseover MouseEvent {dataTransfer: ...}
   change Event {clipboardData: ...}
   ...
  

报告中还有其他例子 documentation . 我猜这个功能是在前面的答案之后添加的。

getEventListeners 在你的 谷歌Chrome开发者控制台 .

getEventListeners(对象)返回在上注册的事件侦听器 指定的对象。

getEventListeners(document.querySelector('option[value=Closed]'));