84669 人學習
152542 人學習
20005 人學習
5487 人學習
7821 人學習
359900 人學習
3350 人學習
180660 人學習
48569 人學習
18603 人學習
40936 人學習
1549 人學習
1183 人學習
32909 人學習
想设置快捷键，但是没有输入框，不知道怎么监听keydown事件
谢谢
走同样的路，发现不同的人生
监听页面document的keydown事件
keydown事件不一定只是绑定某个input输入框，它可以直接绑定整个document.
所有的HTMLElement类, 以及Document,Window类都实现了EventTarget接口,EventTarget接口定义了一个方法来监听事件:
HTMLElement
Document
Window
EventTarget
addEventListener(type: string, listener: EventListenerOrEventListenerObject, useCapture?: boolean): void;
其中第一个参数为要监听在事件名称, 第二个参数为触发执行的函数指针, 第三个是要触发的阶段.
每个事件都要从最顶层Window向下传播到Document到target.parentNode, 这一阶段称为CAPTURE, 然后传播到target, 这一阶段称为TARGET, 再从target.parentNode传播到Document到Window, 这一阶段称为BUBBLE. 在任何一个阶段调用事件的stopPropagation方法都会停止向后传播事件.
target.parentNode
CAPTURE
target
TARGET
BUBBLE
stopPropagation
因此如果要监听页面的某个事件而不依赖于target元素, 可以在window或者document上监听, 并且第三个参数useCapture设置为true.
window
document
useCapture
true
对于keydown事件, 触发事件的target为当前的activeElement, 如果一个元素不可以被focus, 即tabIndex属性小于0, 则不可以触发keydown事件(但是可以手动dispatchEvent).
keydown
activeElement
focus
tabIndex
0
监听页面document的keydown事件
keydown事件不一定只是绑定某个input输入框，它可以直接绑定整个document.
所有的
HTMLElement类, 以及Document,Window类都实现了EventTarget接口,EventTarget接口定义了一个方法来监听事件:其中第一个参数为要监听在事件名称, 第二个参数为触发执行的函数指针, 第三个是要触发的阶段.
每个事件都要从最顶层
Window向下传播到Document到target.parentNode, 这一阶段称为CAPTURE, 然后传播到target, 这一阶段称为TARGET, 再从target.parentNode传播到Document到Window, 这一阶段称为BUBBLE. 在任何一个阶段调用事件的stopPropagation方法都会停止向后传播事件.因此如果要监听页面的某个事件而不依赖于
target元素, 可以在window或者document上监听, 并且第三个参数useCapture设置为true.对于
keydown事件, 触发事件的target为当前的activeElement, 如果一个元素不可以被focus, 即tabIndex属性小于0, 则不可以触发keydown事件(但是可以手动dispatchEvent).