keydown等键盘事件日记

键盘事件由用户击打键盘触发，主要有keydown、keypress、keyup三个事件，它们都继承了KeyboardEvent接口。

keydown：按下键盘时触发。
keypress：按下有值的键时触发，即按下 Ctrl、Alt、Shift、Meta 这样无值的键，这个事件不会触发。对于有值的键，按下时先触发keydown事件，再触发这个事件。
keyup：松开键盘时触发该事件。

keydown和keypress事件的区别是：keypress不可以触发按下Ctrl、Alt、Shift、Meta等特殊的键盘按钮，而对于keydown事件则都会触发。

这三者的触发顺序如下：

1.keydown

2.keypress

3.keyup

KeyboardEvent接口用来描述用户与键盘的互动。这个接口继承了Event接口，并且定义了自己的实例属性和实例方法。

浏览器原生提供KeyboardEvent构造函数，用来新建键盘事件的实例。

KeyboardEvent构造函数接受两个参数。第一个参数是字符串，表示事件类型；第二个参数是一个事件配置对象，该参数可选。除了Event接口提供的属性，还可以配置以下字段，它们都是可选。

key：字符串，当前按下的键，默认为空字符串。
code：字符串，表示当前按下的键的字符串形式，默认为空字符串。
location：整数，当前按下的键的位置，默认为0。
ctrlKey：布尔值，是否按下 Ctrl 键，默认为false。
shiftKey：布尔值，是否按下 Shift 键，默认为false。
altKey：布尔值，是否按下 Alt 键，默认为false。
metaKey：布尔值，是否按下 Meta 键，默认为false。
repeat：布尔值，是否重复按键，默认为false。

KeyboardEvent.code属性返回一个字符串，表示当前按下的键的字符串形式。该属性只读。

下面是一些常用键的字符串形式

数字键0 - 9：返回digit0 - digit9
字母键A - z：返回KeyA - KeyZ
功能键F1 - F12：返回 F1 - F12
方向键：返回ArrowDown、ArrowUp、ArrowLeft、ArrowRight
Alt 键：返回AltLeft或AltRight
Shift 键：返回ShiftLeft或ShiftRight
Ctrl 键：返回ControlLeft或ControlRight

KeyboardEvent.key属性返回一个字符串，表示按下的键名。该属性只读。

如果无法识别键名，返回字符串Unidentified。

KeyboardEvent.keyCode属性返回一个字符串的ASCALL码，该属性只读。

如果无法识别键名，返回字符串Unidentified。

KeyboardEvent.location属性返回一个整数，表示按下的键处在键盘的哪一个区域。它可能取以下值。

0：处在键盘的主区域，或者无法判断处于哪一个区域。
1：处在键盘的左侧，只适用那些有两个位置的键（比如 Ctrl 和 Shift 键）。
2：处在键盘的右侧，只适用那些有两个位置的键（比如 Ctrl 和 Shift 键）。
3：处在数字小键盘。

KeyboardEvent.repeat返回一个布尔值，代表该键是否被按着不放，以便判断是否重复这个键，即浏览器会持续触发keydown和keypress事件，直到用户松开手为止。

KeyboardEvent.getModifierState()方法返回一个布尔值，表示是否按下或激活指定的功能键。它的常用参数如下。

Alt：Alt 键
CapsLock：大写锁定键
Control：Ctrl 键
Meta：Meta 键
NumLock：数字键盘开关键
Shift：Shift 键

keydown等键盘事件日记相关推荐

(Keydown,KeyCode)键盘事件的简单使用
开发工具与关键技术: VS Keydown,KeyCode 作者:听民谣的老猫撰写时间:2019/4/1 16:15 W.A.S.D 是我们玩游戏时经常用到的几个键盘按键.通过W来触发游戏人物向上移 ...
Element ui 组件中用键盘事件
//这是表单 <el-form:model="ruleForm"status-icon:rules="rules"ref="ruleForm&q ...
WinForm下的键盘事件(KeyPress、KeyDown)及如何处理不响应键盘事件
KeyDown事件用来处理功能键:F1 F2 F3... keyPress事件用来处理字符比如说:A B C... 1 2 3... 注:处理该事件时,需要先将窗体的 KeyPreview=tru ...
java keydown_键盘事件keydown、keypress、keyup随笔整理总结
英文输入法: 事件触发顺序:keydown - > keypress - > keyup 中文输入法: firfox:输入触发keydown,回车确认输入触发keyup chrome:输入 ...
Vue 键盘事件（keyup、keydown）
介绍:keyup 表示键盘按键抬起事件,keydown 表示键盘按下事件用法:利用 v-on/ @ 来绑定事件在Vue中,已经为常用的按键设置了别名,这样我们就无需再去匹配keyCode,直接使 ...
python绑定按键pageup键_键盘事件keydown、keypress、keyup随笔整理总结（摘抄）
原文1:http://www.cnblogs.com/silence516/archive/2013/01/25/2876611.html 原文2:http://www.cnblogs.com/leo ...
键盘事件keydown、keypress、keyup随笔整理总结
键盘事件keydown.keypress.keyup随笔整理总结英文输入法: 事件触发顺序:keydown - > keypress - > keyup 中文输入法: firfox:输入 ...
keyup常用事件_键盘事件keydown、keypress、keyup随笔整理总结
键盘英文输入法: 事件触发顺序:keydown - > keypress - > keyup 中文输入法: firfox:输入触发keydown,回车确认输入触发keyup chrome ...
键盘事件keypress 和 keydown、keyup 的用法与区别
KeyDown:用户摁下摁键时发生 KeyPress:用户摁下摁键,并且产生一个字符时发生 KeyUp: 用户释放某一个摁键时触发定义和用法完整的 keypress 过程分为两个部分:1. 按键被 ...

keydown等键盘事件日记

keydown等键盘事件日记相关推荐

最新文章

热门文章