Atitit.js的键盘按键事件捆绑and事件调度


Posted in Javascript onApril 01, 2016

 1. Best的方法还是

objEvtMap[ id+evt ]=function(evt,element)

2. Event bind

function bindEvent_4_dataBlock()
{
var arr=$("#table1 li");
arr.each(function(index, element) {
$(element).keypress(function(){
alert('keypress');
});
var id="data_aid_"+index;
$(element).attr("id","data_aid_"+index);
objEvtMap[ id ]=function(evt,element)
{
if(evt=="down")
key_press_hadler($(element));
if(evt=="up")
key_press_hadler4up($(element));
if(evt=="left")
{};
if(evt=="rit")
{}
};
});
}

3. Event dispatch

document.onkeydown=function(event){
var e = event || window.event || arguments.callee.caller.arguments[0];
alert("keycode:"+e.keyCode);
if(e && e.keyCode==40 ){//下
//alert('40=下键,39=右键');
var now=$(".selected");
var id=$(now).attr("id");
var func=objEvtMap[id ];
func("down",now);
//key_press_hadler(now);
return false;
}

js中获取键盘事件

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

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

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

keyCode = BackSpace BackSpace
keyCode = Tab Tab
keyCode = Clear
keyCode = Enter
keyCode = Shift_L
keyCode = Control_L
keyCode = Alt_L
keyCode = Pause
keyCode = Caps_Lock
keyCode = Escape Escape
keyCode = space
keyCode = Prior
keyCode = Next
keyCode = End
keyCode = Home
keyCode = Left
keyCode = Up
keyCode = Right
keyCode = Down
keyCode = Select
keyCode = Print
keyCode = Execute
keyCode = Insert
keyCode = Delete
keyCode = Help
keyCode = equal braceright
keyCode = exclam onesuperior
keyCode = quotedbl twosuperior
keyCode = section threesuperior
keyCode = dollar
keyCode = percent
keyCode = ampersand
keyCode = slash braceleft
keyCode = parenleft bracketleft
keyCode = parenright bracketright
keyCode = a A
keyCode = b B
keyCode = c C
keyCode = d D
keyCode = e E EuroSign
keyCode = f F
keyCode = g G
keyCode = h H
keyCode = i I
keyCode = j J
keyCode = k K
keyCode = l L
keyCode = m M mu
keyCode = n N
keyCode = o O
keyCode = p P
keyCode = q Q at
keyCode = r R
keyCode = s S
keyCode = t T
keyCode = u U
keyCode = v V
keyCode = w W
keyCode = x X
keyCode = y Y
keyCode = z Z
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_ KP_
keyCode = KP_Multiply KP_Multiply
keyCode = KP_Add KP_Add
keyCode = KP_Separator KP_Separator
keyCode = KP_Subtract KP_Subtract
keyCode = KP_Decimal KP_Decimal
keyCode = KP_Divide KP_Divide
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = F
keyCode = Num_Lock
keyCode = Scroll_Lock
keyCode = acute grave
keyCode = comma semicolon
keyCode = minus underscore
keyCode = period colon
keyCode = numbersign apostrophe
keyCode = plusminus hyphen macron
keyCode =
keyCode = copyright registered
keyCode = guillemotleft guillemotright
keyCode = masculine ordfeminine
keyCode = ae AE
keyCode = cent yen
keyCode = questiondown exclamdown
keyCode = onequarter onehalf threequarters
keyCode = less greater bar
keyCode = plus asterisk asciitilde
keyCode = multiply division
keyCode = acircumflex Acircumflex
keyCode = ecircumflex Ecircumflex
keyCode = icircumflex Icircumflex
keyCode = ocircumflex Ocircumflex
keyCode = ucircumflex Ucircumflex
keyCode = ntilde Ntilde
keyCode = yacute Yacute
keyCode = oslash Ooblique
keyCode = aring Aring
keyCode = ccedilla Ccedilla
keyCode = thorn THORN
keyCode = eth ETH
keyCode = diaeresis cedilla currency
keyCode = agrave Agrave atilde Atilde
keyCode = egrave Egrave
keyCode = igrave Igrave
keyCode = ograve Ograve otilde Otilde
keyCode = ugrave Ugrave
keyCode = adiaeresis Adiaeresis
keyCode = ediaeresis Ediaeresis
keyCode = idiaeresis Idiaeresis
keyCode = odiaeresis Odiaeresis
keyCode = udiaeresis Udiaeresis
keyCode = ssharp question backslash
keyCode = asciicircum degree
keyCode = sterling
keyCode = Mode_switch

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

eg:if(event.keyCode==)alert(“enter!”);

键值对应表

AX  U 
X
B
X  V
 X
C
X  W
 X
D
X  X 
X
E
X  Y
 X
F
X  Z
 X
G
X  
 X
H
X  
 X
I
X  
 X
J
X  
X
K
X  
X
L
X  
X
M
X  
 X
N
X   
X
O
X   
X
P
X   
X
Q
X ESC
XB
R
X CTRL  X
S
X SHIFT X
T
X ENTER XD

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

Javascript 相关文章推荐
比较全面的event对像在IE与FF中的区别 推荐
Sep 21 Javascript
Jquery.LazyLoad.js修正版下载,实现图片延迟加载插件
Mar 12 Javascript
Firefox/Chrome/Safari的中可直接使用$/$$函数进行调试
Feb 13 Javascript
node.js使用require()函数加载模块
Nov 26 Javascript
JS实现仿京东淘宝竖排二级导航
Dec 08 Javascript
简介JavaScript中setUTCSeconds()方法的使用
Jun 12 Javascript
Bootstrap源码学习笔记之bootstrap进度条
Dec 24 Javascript
详解js的六大数据类型
Dec 27 Javascript
jquery实现自定义图片裁剪功能【推荐】
Mar 08 Javascript
js实现瀑布流效果(自动生成新的内容)
Mar 16 Javascript
微信小程序如何修改本地缓存key中单个数据的详解
Apr 26 Javascript
Node.js API详解之 V8模块用法实例分析
Jun 05 Javascript
JS中多步骤多分步的StepJump组件实例详解
Apr 01 #Javascript
js+flash实现的5图变换效果广告代码(附演示与demo源码下载)
Apr 01 #Javascript
js中字符串编码函数escape()、encodeURI()、encodeURIComponent()区别详解
Apr 01 #Javascript
基于jquery实现轮播焦点图插件
Mar 31 #Javascript
javascript中错误使用var造成undefined
Mar 31 #Javascript
详解JavaScript表单验证(E-mail 验证)
Mar 31 #Javascript
js表单验证实例讲解
Mar 31 #Javascript
You might like
PHP中的日期处理方法集锦
2007/01/02 PHP
在服务端进行目录建立、删除,文件上传、删除的过程的php代码
2008/09/10 PHP
php中创建和调用webservice接口示例
2014/07/25 PHP
php下foreach提示Warning:Invalid argument supplied for foreach()的解决方法
2014/11/11 PHP
jquery+php实现导出datatables插件数据到excel的方法
2015/07/06 PHP
php过滤输入操作之htmlentities与htmlspecialchars用法分析
2017/02/17 PHP
PhpSpreadsheet设置单元格常用操作汇总
2020/11/13 PHP
jquery ajax 登录验证实现代码
2009/09/23 Javascript
dwz 如何去掉ajaxloading具体代码
2013/05/22 Javascript
基于jquery实现一张图片点击鼠标放大再点缩小
2013/09/29 Javascript
Nodejs Stream 数据流使用手册
2016/04/17 NodeJs
jQuery 获取屏幕高度、宽度的简单实现案例
2016/05/17 Javascript
jQuery中的一些常见方法小结(推荐)
2016/06/13 Javascript
jQuery制作圣诞主题页面 更像是爱情影集
2016/08/10 Javascript
js实现浏览器倒计时跳转页面效果
2016/08/12 Javascript
VueJs与ReactJS和AngularJS的异同点
2016/12/12 Javascript
JavaScript手风琴页面制作
2017/05/17 Javascript
node文件上传功能简易实现代码
2017/06/16 Javascript
Nodejs中使用phantom将html转为pdf或图片格式的方法
2017/09/18 NodeJs
angular基于ng-alain定义自己的select组件示例
2018/02/23 Javascript
p5.js入门教程之鼠标交互的示例
2018/03/16 Javascript
angular6开发steps步骤条组件
2019/07/04 Javascript
[38:21]2018DOTA2亚洲邀请赛3月30日 小组赛A组 LGD VS Newbee
2018/03/31 DOTA
Python模块的定义,模块的导入,__name__用法实例分析
2020/01/07 Python
Python多线程threading join和守护线程setDeamon原理详解
2020/03/18 Python
CSS3中31种选择器使用方法教程
2013/12/05 HTML / CSS
html5 学习简单的拾色器
2010/09/03 HTML / CSS
美国第二大连锁书店:Books-A-Million
2017/12/28 全球购物
五一手机促销方案
2014/03/08 职场文书
教师求职信
2014/06/17 职场文书
销售经理工作检讨书
2015/02/19 职场文书
综合素质评价个性发展自我评价
2015/03/06 职场文书
幼儿园教师安全责任书
2015/05/08 职场文书
幼师必备:幼儿园期末教师评语50条
2019/11/01 职场文书
python实现图片九宫格分割的示例
2021/04/25 Python
SpringBoot集成MongoDB实现文件上传的步骤
2022/04/18 MongoDB