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 相关文章推荐
自己的js工具 Cookie 封装
Aug 21 Javascript
jquery.autocomplete修改实现键盘上下键自动填充示例
Nov 19 Javascript
JS小功能(button选择颜色)简单实例
Nov 29 Javascript
基于jQuery实现仿淘宝套餐选择插件
Mar 04 Javascript
跟我学习javascript的prototype使用注意事项
Nov 17 Javascript
Jquery与Bootstrap实现后台管理页面增删改查功能示例
Jan 22 Javascript
解决jQuery ajax动态新增节点无法触发点击事件的问题
May 24 jQuery
jquery实现图片放大点击切换
Jun 06 jQuery
Web技术实现移动监测的介绍
Sep 18 Javascript
javascript异步编程的六种方式总结
May 17 Javascript
JS快速实现简单计算器
Apr 08 Javascript
javascript实现评分功能
Jun 24 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 eval函数使用介绍
2013/12/08 PHP
PHP mail()函数使用及配置方法
2014/01/14 PHP
PHP读取大文件的类SplFileObject使用介绍
2014/04/09 PHP
php中switch语句用法详解
2015/08/17 PHP
php数组和链表的区别总结
2019/09/20 PHP
一个js实现的所谓的滑动门
2007/05/23 Javascript
JS刷新当前页面的几种方法总结
2013/12/24 Javascript
解决json日期格式问题的3种方法
2014/02/02 Javascript
js获取url中&quot;?&quot;后面的字串方法
2014/05/15 Javascript
jquery中获取元素里某一特定子元素的代码
2014/12/02 Javascript
js仿百度登录页实现拖动窗口效果
2016/03/11 Javascript
JavaScript必知必会(六) delete in instanceof
2016/06/08 Javascript
JS生成不重复的随机数组的简单实例
2016/07/10 Javascript
AngularJS 打开新的标签页实现代码
2017/09/07 Javascript
取消Bootstrap的dropdown-menu点击默认关闭事件方法
2018/08/10 Javascript
vue-router 实现导航守卫(路由卫士)的实例代码
2018/09/02 Javascript
AngularJS动态生成select下拉框的方法实例
2019/11/17 Javascript
JavaScript交换两个变量方法实例
2019/11/25 Javascript
JS实现简单日历特效
2020/01/03 Javascript
vue实现简易图片左右旋转,上一张,下一张组件案例
2020/07/31 Javascript
JS实现拖拽元素时与另一元素碰撞检测
2020/08/27 Javascript
python通过floor函数舍弃小数位的方法
2015/03/17 Python
详解Python中的strftime()方法的使用
2015/05/22 Python
python并发和异步编程实例
2018/11/15 Python
对python_discover方法遍历所有执行的用例详解
2019/02/13 Python
python中aioysql(异步操作MySQL)的方法
2019/04/11 Python
python基于itchat模块实现微信防撤回
2019/04/29 Python
python使用docx模块读写docx文件的方法与docx模块常用方法详解
2020/02/17 Python
Python jieba库分词模式实例用法
2021/01/13 Python
用React加CSS3实现微信拆红包动画效果
2017/03/13 HTML / CSS
世界经理人咨询有限公司面试
2014/09/23 面试题
公司会议策划方案
2014/05/17 职场文书
运输企业安全生产责任书
2014/07/28 职场文书
银行授权委托书格式
2014/10/10 职场文书
医院病假条怎么写
2015/08/17 职场文书
详解Java实现设计模式之责任链模式
2021/06/23 Java/Android