Javascript 检测键盘按键信息及键码值对应介绍


Posted in Javascript onJanuary 03, 2013

Javascript中有3个事件句柄在对应键盘的输入状态:keydown、keypress和keyup。
分别对应的意思是:按键被按下(按下按键但还没有抬起)、点击按键(按下并抬起按键)、按键抬起(按键抬起之后)
按键的分类
按键可以分为“实键”和“虚键”
实键可以理解为我们能够看到并打印出来的按键,如字母“A”、数字“1”、字符“?”等等
虚键就是那些无法打印出来起到控制作用的按键,如“Ctrl”、“Alt”、“Shift”、“方向键”等等
IE在处理虚键时有个特例:虚键不会产生keypress事件,必须使用keydown或keyup来捕获
按键码和字符码
按键码是计算机用来识别不同按键的编码,每一个按键都有按键码
字符码是可被打印的实键特有的,对应了键盘上显示的字符
按键码可以使用String.fromCharCode()转换为字符码
按键码和和字符码的对应表可以在本文最后找到。
获取实键

function getKeyCode(e) { 
var keyCode = 0; 
var e = e || window.event; 
keyCode = e.keyCode || e.which || e.charCode; 
alert(keyCode); 
}

稍微解释下
1. e为Firefox等标准浏览器支持的JS隐藏变量,表示一个“事件”;IE系列中没有“e”,而是用window.event来表示“事件”;所以var e = e || window.event;就表示:获取当前正在发生的事件。
2. e.keyCode、e.which、e.charCode都代表获取按键码,但不同的浏览器支持不同的写法
获取虚键
function getKeyCode(e) { 
var keyCode = 0; 
var e = e || window.event; 
if (e.ctrlKey) alert("ctrlKey pressed"); 
if (e.altKey) alert("altKey pressed"); 
if (e.shiftKey) alert("shiftKey pressed"); 
}

字母和数字键的键码值(keyCode)
按键 键码 按键 键码 按键 键码 按键 键码
A 65 J 74 S 83 1 49
B 66 K 75 T 84 2 50
C 67 L 76 U 85 3 51
D 68 M 77 V 86 4 52
E 69 N 78 W 87 5 53
F 70 O 79 X 88 6 54
G 71 P 80 Y 89 7 55
H 72 Q 81 Z 90 8 56
I 73 R 82 0 48 9 57

数字键盘上的键的键码值(keyCode) 功能键键码值(keyCode)
按键 键码 按键 键码 按键 键码 按键 键码
0 96 8 104 F1 112 F7 118
1 97 9 105 F2 113 F8 119
2 98 * 106 F3 114 F9 120
3 99 + 107 F4 115 F10 121
4 100 Enter 108 F5 116 F11 122
5 101 - 109 F6 117 F12 123
6 102 . 110        
7 103 / 111        
控制键键码值(keyCode)
按键 键码 按键 键码 按键 键码 按键 键码
BackSpace 8 Esc 27 Right Arrow 39 -_ 189
Tab 9 Spacebar 32 Dw Arrow 40 .> 190
Clear 12 Page Up 33 Insert 45 /? 191
Enter 13 Page Down 34 Delete 46 `~ 192
Shift 16 End 35 Num Lock 144 [{ 219
Control 17 Home 36 ;: 186 \| 220
Alt 18 Left Arrow 37 =+ 187 ]} 221
Cape Lock 20 Up Arrow 38 , 188 '" 222
多媒体键码值(keyCode)
按键 键码 按键 键码 按键 键码 按键 键码
音量加 175            
音量减 174            
停止 179            
静音 173            
浏览器 172            
邮件 180            
搜索 170            
收藏 171            
Javascript 相关文章推荐
js+数组实现网页上显示时间/星期几的实用方法
Jan 18 Javascript
jQuery中hover与mouseover和mouseout的区别分析
Dec 24 Javascript
javascript基础知识分享之类与函数化
Feb 13 Javascript
JS实现的多张图片轮流播放幻灯片效果
Jul 22 Javascript
获取当前月(季度/年)的最后一天(set相关操作及应用)
Dec 27 Javascript
纯javaScript、jQuery实现个性化图片轮播【推荐】
Jan 08 Javascript
整理关于Bootstrap表单的慕课笔记
Mar 29 Javascript
AngularJS路由Ui-router模块用法示例
May 29 Javascript
浅谈Vue SPA 首屏加载优化实践
Dec 15 Javascript
详解VS Code使用之Vue工程配置format代码格式化
Mar 20 Javascript
微信小程序自定义弹窗滚动与页面滚动冲突的解决方法
Jul 16 Javascript
ES6 解构赋值的原理及运用
May 25 Javascript
JQuery入门—编写一个简单的JQuery应用案例
Jan 03 #Javascript
JQuery入门—JQuery程序的代码风格详细介绍
Jan 03 #Javascript
web开发人员学习jQuery的6大理由及jQuery的优势介绍
Jan 03 #Javascript
JavaScript实现x秒后自动跳转到一个页面
Jan 03 #Javascript
Javascript 判断是否存在函数的方法
Jan 03 #Javascript
JavaScript中“基本类型”之争小结
Jan 03 #Javascript
Javascript图像处理—亮度对比度应用案例
Jan 03 #Javascript
You might like
openPNE常用方法分享
2011/11/29 PHP
基于php split()函数的用法详解
2013/06/05 PHP
php中删除数组的第一个元素和最后一个元素的函数
2015/03/07 PHP
php根据一个给定范围和步进生成数组的方法
2015/06/19 PHP
IE中createElement需要注意的一个问题
2010/07/13 Javascript
jQuery 表单验证扩展(四)
2010/10/20 Javascript
JQuery datepicker 使用方法
2011/05/20 Javascript
JS获取浏览器版本及名称实现函数
2013/04/02 Javascript
jQuery级联操作绑定事件实例
2014/09/02 Javascript
JavaScript window.location对象
2014/11/14 Javascript
Jquery 实现图片轮换
2015/01/28 Javascript
JS打印组合功能
2016/08/04 Javascript
Bootstrap3 多选和单选框(checkbox)
2016/12/29 Javascript
Vue应用部署到服务器的正确方式
2017/07/15 Javascript
vue插槽slot的理解和使用方法
2019/04/03 Javascript
前端路由&webpack基础配置详解
2019/06/10 Javascript
手写Vue弹窗Modal的实现代码
2019/09/11 Javascript
JavaScript实现沿五角星形线摆动的小圆实例详解
2020/07/28 Javascript
python实现推箱子游戏
2020/03/25 Python
python使用PIL模块获取图片像素点的方法
2019/01/08 Python
Python之循环结构
2019/01/15 Python
Django使用Channels实现WebSocket的方法
2019/07/28 Python
python join方法使用详解
2019/07/30 Python
PyCharm2020.1.2社区版安装,配置及使用教程详解(Windows)
2020/08/07 Python
Python3利用openpyxl读写Excel文件的方法实例
2021/02/03 Python
SmartBuyGlasses英国:购买太阳镜和眼镜
2018/01/29 全球购物
欧洲顶级的童装奢侈品购物网站:Bambini Fashion(面向全球)
2018/04/24 全球购物
联想阿根廷官方网站:Lenovo Argentina
2019/10/14 全球购物
Java编程面试题
2016/04/04 面试题
PyQt 如何创建自定义QWidget
2021/03/24 Python
大学学习个人的自我评价
2014/02/18 职场文书
党的群众路线教育实践活动对照检查材料(教师)
2014/09/24 职场文书
培训师岗位职责
2015/02/14 职场文书
2015年征兵工作总结
2015/07/23 职场文书
高考百日冲刺决心书
2015/09/23 职场文书
python文件目录操作之os模块
2021/05/08 Python