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 相关文章推荐
获取URL地址中的文件名和参数的javascript代码
Sep 02 Javascript
仿百度的关键词匹配搜索示例
Sep 25 Javascript
实现动画效果核心方式的js代码
Sep 27 Javascript
JS实现根据出生年月计算年龄
Jan 10 Javascript
Vue监听事件实现计数点击依次增加的方法
Sep 26 Javascript
Vue项目中最新用到的一些实用小技巧
Nov 06 Javascript
详解vue-cli 3.0 build包太大导致首屏过长的解决方案
Nov 10 Javascript
vue.js中ref及$refs的使用方法解析
Oct 08 Javascript
基于JavaScript实现单例模式
Oct 30 Javascript
JS实现容器模块左右拖动效果
Jan 14 Javascript
Vue.js仿Select下拉框效果
Feb 18 Javascript
js属性对象的hasOwnProperty方法的使用
Feb 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取整数函数常用的四种方法小结
2012/07/05 PHP
smarty实现多级分类的方法
2014/12/05 PHP
php中的动态调用实例分析
2015/01/07 PHP
详解阿里云视频直播PHP-SDK接入教程
2020/07/09 PHP
鼠标放在图片上显示大图的JS代码
2013/03/26 Javascript
javascript事件冒泡实例分析
2015/05/13 Javascript
浅谈JavaScript中变量和函数声明的提升
2016/08/09 Javascript
js仿小米官网图片轮播特效
2016/09/29 Javascript
vue实现留言板todolist功能
2017/08/16 Javascript
解决vue+element 键盘回车事件导致页面刷新的问题
2018/08/25 Javascript
webpack4+Vue搭建自己的Vue-cli项目过程分享
2018/08/29 Javascript
详解如何快速配置webpack多入口脚手架
2018/12/28 Javascript
利用不到200行代码写一款属于你自己的js类库
2019/07/08 Javascript
jQuery-Citys省市区三级菜单联动插件使用详解
2019/07/26 jQuery
python实现基于SVM手写数字识别功能
2020/05/27 Python
用tensorflow构建线性回归模型的示例代码
2018/03/05 Python
Python 判断文件或目录是否存在的实例代码
2018/07/19 Python
PyQt 实现使窗口中的元素跟随窗口大小的变化而变化
2019/06/18 Python
使用python画社交网络图实例代码
2019/07/10 Python
python IDLE 背景以及字体大小的修改方法
2019/07/12 Python
Django Admin中增加导出Excel功能过程解析
2019/09/04 Python
Django restframework 框架认证、权限、限流用法示例
2019/12/21 Python
Tensorflow设置显存自适应,显存比例的操作
2020/02/03 Python
Python callable内置函数原理解析
2020/03/05 Python
Pycharm中配置远程Docker运行环境的教程图解
2020/06/11 Python
使用Python webdriver图书馆抢座自动预约的正确方法
2021/03/04 Python
戴尔马来西亚官网:Dell Malaysia
2020/05/02 全球购物
校庆接待方案
2014/03/18 职场文书
法人授权委托书范本
2014/04/04 职场文书
地理信息科学专业推荐信
2014/09/08 职场文书
我们的节日重阳节活动总结
2015/03/24 职场文书
2015年学校教务处工作总结
2015/05/11 职场文书
聊聊JS ES6中的解构
2021/04/29 Javascript
一次项目中Thinkphp绕过禁用函数的实战记录
2021/11/17 PHP
Pycharm远程调试和MySQL数据库授权问题
2022/03/18 MySQL
Python requests用法和django后台处理详解
2022/03/19 Python