js获取及判断键盘按键的方法


Posted in Javascript onDecember 01, 2015

本文实例讲述了js获取及判断键盘按键的方法。分享给大家供大家参考,具体如下:

js 里面的键盘事件经常用到,所以收集了键盘事件对应的键码来分享下:

keyCode 8 = BackSpace BackSpace
keyCode 9 = Tab Tab
keyCode 12 = Clear
keyCode 13 = Enter
keyCode 16 = Shift_L
keyCode 17 = Control_L
keyCode 18 = Alt_L
keyCode 19 = Pause
keyCode 20 = Caps_Lock
keyCode 27 = Escape Escape
keyCode 32 = space
keyCode 33 = Prior
keyCode 34 = Next
keyCode 35 = End
keyCode 36 = Home
keyCode 37 = Left
keyCode 38 = Up
keyCode 39 = Right
keyCode 40 = Down
keyCode 41 = Select
keyCode 42 = Print
keyCode 43 = Execute
keyCode 45 = Insert
keyCode 46 = Delete
keyCode 47 = Help
keyCode 48 = 0 equal braceright
keyCode 49 = 1 exclam onesuperior
keyCode 50 = 2 quotedbl twosuperior
keyCode 51 = 3 section threesuperior
keyCode 52 = 4 dollar
keyCode 53 = 5 percent
keyCode 54 = 6 ampersand
keyCode 55 = 7 slash braceleft
keyCode 56 = 8 parenleft bracketleft
keyCode 57 = 9 parenright bracketright
keyCode 65 = a A
keyCode 66 = b B
keyCode 67 = c C
keyCode 68 = d D
keyCode 69 = e E EuroSign
keyCode 70 = f F
keyCode 71 = g G
keyCode 72 = h H
keyCode 73 = i I
keyCode 74 = j J
keyCode 75 = k K
keyCode 76 = l L
keyCode 77 = m M mu
keyCode 78 = n N
keyCode 79 = o O
keyCode 80 = p P
keyCode 81 = q Q at
keyCode 82 = r R
keyCode 83 = s S
keyCode 84 = t T
keyCode 85 = u U
keyCode 86 = v V
keyCode 87 = w W
keyCode 88 = x X
keyCode 89 = y Y
keyCode 90 = z Z
keyCode 96 = KP_0 KP_0
keyCode 97 = KP_1 KP_1
keyCode 98 = KP_2 KP_2
keyCode 99 = KP_3 KP_3
keyCode 100 = KP_4 KP_4
keyCode 101 = KP_5 KP_5
keyCode 102 = KP_6 KP_6
keyCode 103 = KP_7 KP_7
keyCode 104 = KP_8 KP_8
keyCode 105 = KP_9 KP_9
keyCode 106 = KP_Multiply KP_Multiply
keyCode 107 = KP_Add KP_Add
keyCode 108 = KP_Separator KP_Separator
keyCode 109 = KP_Subtract KP_Subtract
keyCode 110 = KP_Decimal KP_Decimal
keyCode 111 = KP_Divide KP_Divide
keyCode 112 = F1
keyCode 113 = F2
keyCode 114 = F3
keyCode 115 = F4
keyCode 116 = F5
keyCode 117 = F6
keyCode 118 = F7
keyCode 119 = F8
keyCode 120 = F9
keyCode 121 = F10
keyCode 122 = F11
keyCode 123 = F12
keyCode 124 = F13
keyCode 125 = F14
keyCode 126 = F15
keyCode 127 = F16
keyCode 128 = F17
keyCode 129 = F18
keyCode 130 = F19
keyCode 131 = F20
keyCode 132 = F21
keyCode 133 = F22
keyCode 134 = F23
keyCode 135 = F24
keyCode 136 = Num_Lock
keyCode 137 = Scroll_Lock
keyCode 187 = acute grave
keyCode 188 = comma semicolon
keyCode 189 = minus underscore
keyCode 190 = period colon
keyCode 192 = numbersign apostrophe
keyCode 210 = plusminus hyphen macron
keyCode 211 =
keyCode 212 = copyright registered
keyCode 213 = guillemotleft guillemotright
keyCode 214 = masculine ordfeminine
keyCode 215 = ae AE
keyCode 216 = cent yen
keyCode 217 = questiondown exclamdown
keyCode 218 = onequarter onehalf threequarters
keyCode 220 = less greater bar
keyCode 221 = plus asterisk asciitilde
keyCode 227 = multiply division
keyCode 228 = acircumflex Acircumflex
keyCode 229 = ecircumflex Ecircumflex
keyCode 230 = icircumflex Icircumflex
keyCode 231 = ocircumflex Ocircumflex
keyCode 232 = ucircumflex Ucircumflex
keyCode 233 = ntilde Ntilde
keyCode 234 = yacute Yacute
keyCode 235 = oslash Ooblique
keyCode 236 = aring Aring
keyCode 237 = ccedilla Ccedilla
keyCode 238 = thorn THORN
keyCode 239 = eth ETH
keyCode 240 = diaeresis cedilla currency
keyCode 241 = agrave Agrave atilde Atilde
keyCode 242 = egrave Egrave
keyCode 243 = igrave Igrave
keyCode 244 = ograve Ograve otilde Otilde
keyCode 245 = ugrave Ugrave
keyCode 246 = adiaeresis Adiaeresis
keyCode 247 = ediaeresis Ediaeresis
keyCode 248 = idiaeresis Idiaeresis
keyCode 249 = odiaeresis Odiaeresis
keyCode 250 = udiaeresis Udiaeresis
keyCode 251 = ssharp question backslash
keyCode 252 = asciicircum degree
keyCode 253 = 3 sterling
keyCode 254 = Mode_switch

使用event对象的keyCode属性判断输入的键值

eg:

if(event.keyCode==13)alert("enter!");

键值对应表

A0X65  U 
0X85
B
0X66  V
 0X86
C
0X67  W
 0X87
D
0X68  X 
0X88
E
0X69  Y
 0X89
F
0X70  Z
 0X90
G
0X71  0
 0X48
H
0X72  1
 0X49
I
0X73  2
 0X50
J
0X74  3 
0X51
K
0X75  4 
0X52
L
0X76  5 
0X53
M
0X77  6
 0X54
N
0X78  7 
0X55
O
0X79  8 
0X56
P
0X80  9 
0X57
Q
0X81 ESC
0X1B
R
0X82 CTRL  0X11
S
0X83 SHIFT 0X10
T
0X84 ENTER 0XD

如果要使用组合键,则可以判断是否同时按下了这几个键,比如ctrl键、shift键以及alt键的组合使用就可以判断是否多按下了ctrl键、shift键以及alt键

js获取键盘事件:

<script type="text/javascript" language=JavaScript charset="UTF-8">
document.onkeydown=function(event){
  var e = event || window.event || arguments.callee.caller.arguments[0];
  if(e && e.keyCode==27){ // 按 Esc 
    //要做的事情
   }
  if(e && e.keyCode==113){ // 按 F2 
     //要做的事情
    }      
   if(e && e.keyCode==13){ // enter 键
     //要做的事情
  }
}; 
</script>

只要你定义了这些键的动作,你在浏览器里按下这些键就会响应,兼容目前所有浏览器。

JS判断键盘按键

window.document.onkeydown = disableRefresh;
function disableRefresh(evt){
evt = (evt) ? evt : window.event
if (evt.keyCode) {
  if(evt.keyCode == 116){
   //do something
  }
}
}

键码同上例所示。

使用event对象的keyCode属性判断输入的键值

eg:

if(event.keyCode==13){
var ieKey=event.keyCode;//获得键值,数字形式的
var realkey=String.fromCharCode(ieKey) //将数字形式的键值转化为真实的按键
alert(realkey);
}

键值对应表同上例所示

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
关于ExtJS4.1:快捷键支持的问题
Apr 24 Javascript
jquery二级导航内容均分的原理及实现
Aug 13 Javascript
javascript中Number对象的toString()方法分析
Dec 20 Javascript
跨域资源共享 CORS 详解
Apr 26 Javascript
值得分享的轻量级Bootstrap Table表格插件
May 30 Javascript
JS实现列表的响应式排版(推荐)
Sep 01 Javascript
jQuery EasyUI右键菜单实现关闭标签/选项卡
Oct 10 Javascript
微信小程序如何获取openid及用户信息
Jan 26 Javascript
微信小程序canvas绘制圆角base64图片的实现
Aug 18 Javascript
JS实现普通轮播图特效
Jan 01 Javascript
vue 使用rules对表单字段进行校验的步骤
Dec 25 Vue.js
React如何创建组件
Jun 27 Javascript
Eclipse引入jquery报错如何解决
Dec 01 #Javascript
JS验证邮件地址格式方法小结
Dec 01 #Javascript
基于JavaScript操作DOM常用的API小结
Dec 01 #Javascript
常见JS验证脚本汇总
Dec 01 #Javascript
详解JavaScript函数
Dec 01 #Javascript
javascript定义类和类的实现实例详解
Dec 01 #Javascript
深入JavaScript高级程序设计之对象、数组(栈方法,队列方法,重排序方法,迭代方法)
Dec 01 #Javascript
You might like
谷歌音乐搜索栏的提示功能php修正代码
2011/05/09 PHP
php返回json数据函数实例
2014/10/09 PHP
PHP代码判断设备是手机还是平板电脑(两种方法)
2015/10/19 PHP
CodeIgniter视图使用注意事项
2016/01/20 PHP
Thinkphp实现站点静态化的方法详解
2017/03/21 PHP
关于Curl在Swoole协程中的解决方案详析
2019/09/12 PHP
PHP ElasticSearch做搜索实例讲解
2020/02/05 PHP
多浏览器支持的右下角浮动窗口
2010/04/01 Javascript
validator验证控件使用代码
2010/11/23 Javascript
addEventListener和attachEvent二者绑定的执行函数中的this不相同
2012/12/09 Javascript
js动态添加事件并可传参数示例代码
2013/10/21 Javascript
最短的IE判断var ie=!-[1,]分析
2014/05/28 Javascript
JavaScript 事件对象介绍
2015/04/13 Javascript
javascript禁止超链接跳转的方法
2016/02/02 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
2016/04/29 Javascript
JavaScript的setter与getter方法
2017/11/29 Javascript
JS面向对象的程序设计相关知识小结
2018/05/26 Javascript
解决element UI 自定义传参的问题
2018/08/22 Javascript
vue完成项目后,打包成静态文件的方法
2018/09/03 Javascript
Vue中的Props(不可变状态)
2018/09/29 Javascript
[29:10]Ti4 冒泡赛第二天 NEWBEE vs Titan 3
2014/07/15 DOTA
Python3匿名函数用法示例
2018/07/25 Python
python数据类型之间怎么转换技巧分享
2019/08/20 Python
Django之form组件自动校验数据实现
2020/01/14 Python
解决echarts中饼图标签重叠的问题
2020/05/16 Python
英国珠宝钟表和家居礼品精品店:David Shuttle
2018/02/24 全球购物
阿迪达斯英国官方网站:adidas英国
2019/08/13 全球购物
MediaMarkt比利时:欧洲最大电器连锁店
2020/12/21 全球购物
机械制造与自动化应届生求职信
2013/11/16 职场文书
电力公司个人求职信范文
2014/02/04 职场文书
企业法人代表证明书
2014/09/27 职场文书
入党介绍人意见范文
2015/06/01 职场文书
旅游投诉信范文
2015/07/02 职场文书
uniapp开发小程序的经验总结
2021/04/08 Javascript
Go语言操作数据库及其常规操作的示例代码
2021/04/21 Golang
详解python网络进程
2021/06/15 Python