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 prototype 格式化数字 By shawl.qiu
Apr 02 Javascript
Javascript 学习笔记 错误处理
Jul 30 Javascript
javascript 面向对象全新理练之继承与多态
Dec 03 Javascript
JS操作Cookies包括(读取添加与删除)
Dec 26 Javascript
Jquery图片滚动与幻灯片的实例代码
Apr 08 Javascript
JavaScript html5 canvas绘制时钟效果
Mar 01 Javascript
AngularJS基础 ng-dblclick 指令用法
Aug 01 Javascript
JS控件bootstrap suggest plugin使用方法详解
Mar 25 Javascript
浅谈Angular4中常用管道
Sep 27 Javascript
微信小程序实现页面跳转传值的方法
Oct 12 Javascript
Vue 路由 过渡动效 数据获取方法
Jul 31 Javascript
ES6新增的数组知识实例小结
May 23 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
php使用scandir()函数扫描指定目录下所有文件示例
2019/06/08 PHP
php面向对象重点知识分享
2019/09/27 PHP
JavaScript中为什么null==0为false而null大于=0为true(个人研究)
2013/09/16 Javascript
javascript实现数字+字母验证码的简单实例
2014/02/10 Javascript
JS解析XML实例分析
2015/01/30 Javascript
JavaScript基本的输出和嵌入式写法教程
2015/10/20 Javascript
Angular中的interceptors拦截器
2017/06/25 Javascript
详细AngularJs4的图片剪裁组件的实例
2017/07/12 Javascript
Vue-cli3项目配置Vue.config.js实战记录
2018/07/29 Javascript
Vue CLI3基础学习之pages构建多页应用
2019/06/02 Javascript
Openlayers学习之加载鹰眼控件
2020/09/28 Javascript
JavaScript大数相加相乘的实现方法实例
2020/10/18 Javascript
[03:55]DOTA2完美大师赛选手传记——LFY.MONET
2017/11/18 DOTA
[52:12]FNATIC vs Infamous 2019国际邀请赛小组赛 BO2 第一场 8.16
2019/08/19 DOTA
跟老齐学Python之有容乃大的list(2)
2014/09/15 Python
Python封装shell命令实例分析
2015/05/05 Python
python绘制热力图heatmap
2020/03/23 Python
python对矩阵进行转置的2种处理方法
2019/07/17 Python
Python OpenCV调用摄像头检测人脸并截图
2020/08/20 Python
python找出因数与质因数的方法
2019/07/25 Python
利用python在大量数据文件下删除某一行的例子
2019/08/21 Python
python kafka 多线程消费者&手动提交实例
2019/12/21 Python
python 一维二维插值实例
2020/04/22 Python
详解python命令提示符窗口下如何运行python脚本
2020/09/11 Python
Python self用法详解
2020/11/28 Python
如何写一个Java类既可以用作applet也可以用作java应用
2016/01/18 面试题
程序员跳槽必看面试题总结
2013/06/28 面试题
会计专业大学生求职信范文
2014/01/28 职场文书
致裁判员加油稿
2014/02/08 职场文书
医学检验专业自荐信
2014/09/18 职场文书
学校党的群众路线教育实践活动个人整改方案
2014/10/31 职场文书
教代会闭幕词
2015/01/28 职场文书
公司要求试用期员工提交“述职报告”,该怎么写?
2019/07/17 职场文书
简单介绍 http请求响应参数、无连接无状态、MIME、状态码、端口、telnet、curl
2021/03/31 HTML / CSS
Python合并pdf文件的工具
2021/07/01 Python
SQL Server一个字符串拆分多行显示或者多行数据合并成一个字符串
2022/05/25 SQL Server