如何查看页面绑定的事件

上述截图所示， window的keydown事件绑定了两个回调函数，且都是对按键ESC的处理。

popup-manager.js(addEventListener)是引用的第三方组件绑定的，点击esc按钮后页面空白，为了解决该问题，我给keydown事件添加了新的回调函数，在新的回调函数内部使用e.stopPropagation()，意图阻止popup-manager.js(addEventListener)回调函数执行；开始的时候阻止操作没有生效，没有生效的原因是我没有设置useCapture为ture。

addEventListener的第三个参数

addEventListener的第三个参数可以不定义
addEventListener的第三个参数可以是一个对象
addEventListener的第三个参数可以是useCapture

addEventListener方法的第三个参数是一个布尔值，用于指定事件是在捕获阶段还是冒泡阶段触发。如果useCapture为true，则事件在捕获阶段触发；如果useCapture为false（默认值），则事件在冒泡阶段触发。

DOM事件的传播过程

在DOM事件中，事件的传播过程分为三个阶段：捕获阶段、目标阶段和冒泡阶段。

捕获阶段：事件从最外层的祖先元素开始向下传播，直到达到目标元素。

目标阶段：事件到达目标元素。

冒泡阶段：事件从目标元素开始向上冒泡，直到达到最外层的祖先元素。

DOM事件的传播顺序

捕获阶段先于冒泡阶段执行。在捕获阶段，事件从window对象开始向下传播，然后到达目标元素。然后在冒泡阶段，事件从目标元素开始向上冒泡到window对象。

所以window的keydown绑定的两个回调函数，useCapture为true的先执行。

如果window对象绑定了两次keydown事件，并且都没有设置useCapture参数，默认情况下这两个事件会在冒泡阶段触发。

根据DOM事件传播的规则，事件会从目标元素开始向上冒泡到window对象。在冒泡阶段，先绑定的事件会先触发，后绑定的事件会在它之后触发。

因此，先绑定的keydown事件会先触发，后绑定的keydown事件会在它之后触发。

在上面截图popup-manager.js(addEventListener)是在reportView.js(addEventListener)之前绑定的，所以popup-manager.js(addEventListener)的回调函数会先执行，所以reportView.js(addEventListener)没有设置useCapture为true的时候，没能阻止popup-manager.js(addEventListener)回调函数的执行。

e.stopPropagation

e.stopPropagation()是一个用于阻止事件继续传播的方法。