欢迎使用优快云-markdown编辑器

Chrome的console中用monitorEvents查看element的事件

比如HTML有如下代码段：

<input type="text" id="inputInfo" value="input sth"></input>

在chrome打开开发者工具的console，输入monitorEvents($(‘#inputInfo’)[0]),回车。
然后把鼠标移到input中，可以在控制台中看到input的各种event。

注意: monitorEvents的参数必须是Document的element，不能是jQuery的对象。比如

• monitorEvents(document.getElementById(‘inputInfo’));
• monitorEvents($(‘#inputInfo’)[0]);
  第二个参数是关注的event，monitorEvents(document.getElementById(‘inputInfo’), “change”), 如果没有，输出全部event。
  取消输出：unmonitorEvents(document.getElementById(‘inputInfo’));

---

参考：https://developers.google.com/web/tools/chrome-devtools/debug/command-line/events?hl=en
Monitor events
The monitorEvents() method instructs the DevTools to log information on the specified targets.

The first parameter is the object to monitor. All events return if the second parameter is not provided. To specify the events to listen to, pass either a string or an array of strings as the second parameter.

Listen to click events on the body of the page:

monitorEvents(document.body, “click”);
If the monitored event is a supported event type that the DevTools maps to a set of standard event names, then the method listens to the events for that type.

The Command Line API has a full mapping of event types to the events they cover.

To stop monitoring events, call the unmonitorEvents() method and give it the object to stop monitoring.

Stop listening to events on the body object:

unmonitorEvents(document.body);