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 相关文章推荐
JQery jstree 大数据量问题解决方法
Mar 09 Javascript
jQuery链式操作如何实现以及为什么要用链式操作
Jan 17 Javascript
js与运算符和或运算符的妙用
Feb 14 Javascript
thinkphp 表名 大小写 窍门
Feb 01 Javascript
浅谈$('div a') 与$('div&gt;a')的区别
Jul 18 Javascript
AngularJS利用Controller完成URL跳转
Aug 09 Javascript
轻松理解Javascript变量的相关问题
Jan 20 Javascript
浅谈Redux中间件的实践
Jul 27 Javascript
微信公众平台获取access_token的方法步骤
Mar 29 Javascript
vue下使用nginx刷新页面404的问题解决
Aug 02 Javascript
React学习之JSX与react事件实例分析
Jan 06 Javascript
jquery轮播图插件使用方法详解
Jul 31 jQuery
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连接函数implode与分割explode的深入解析
2013/06/26 PHP
PHP mail()函数使用及配置方法
2014/01/14 PHP
php实现有趣的人品测试程序实例
2015/06/08 PHP
javascript 网页跳转的方法
2008/12/24 Javascript
JavaScript在多浏览器下for循环的使用方法
2012/11/07 Javascript
js与css实现弹出层覆盖整个页面的方法
2014/12/13 Javascript
js使用Array.prototype.sort()对数组对象排序的方法
2015/01/28 Javascript
js关于命名空间的函数实例
2015/02/05 Javascript
javascript实现根据时间段显示问候语的方法
2015/06/18 Javascript
浅谈JavaScript中的string拥有方法的原因
2015/08/28 Javascript
node.js+express制作网页计算器
2016/01/17 Javascript
jQuery 弹出层插件(推荐)
2016/05/24 Javascript
Bootstrap CSS组件之按钮下拉菜单
2016/12/17 Javascript
mac下的nodejs环境安装的步骤
2017/05/24 NodeJs
JavaScript与Java正则表达式写法的区别介绍
2017/08/15 Javascript
vue2利用Bus.js如何实现非父子组件通信详解
2017/08/25 Javascript
详解ES6系列之私有变量的实现
2018/11/21 Javascript
JavaScript this使用方法图解
2020/02/04 Javascript
用Python实现一个简单的多线程TCP服务器的教程
2015/05/05 Python
Python中的ceil()方法使用教程
2015/05/14 Python
通过python+selenium3实现浏览器刷简书文章阅读量
2017/12/26 Python
python实现归并排序算法
2018/11/22 Python
对Python的交互模式和直接运行.py文件的区别详解
2019/06/29 Python
简单了解Python3里的一些新特性
2019/07/13 Python
pyinstaller打包找不到文件的问题解决
2020/04/15 Python
Python读写压缩文件的方法
2020/07/30 Python
如何完美的建立一个python项目
2020/10/09 Python
Pandas中DataFrame交换列顺序的方法实现
2020/12/14 Python
帕克纽约:PARKER NY
2018/12/09 全球购物
C/C++程序员常见面试题二
2015/11/19 面试题
公关关系专员的自我评价分享
2013/11/20 职场文书
机电一体化求职信
2014/03/10 职场文书
住宅质量保证书
2014/04/29 职场文书
《生物入侵者》教学反思
2016/02/16 职场文书
Python爬虫中urllib3与urllib的区别是什么
2021/07/21 Python
使用python绘制分组对比柱状图
2022/04/21 Python