当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JavaScript Event学习第十一章 按键的检测

Javascript
QQ邮箱的一个文本编辑器代码
Z-Blog中用到的js代码
绝对经典的滑轮新闻显示(javascript+css)实现
用js实现的仿sohu博客更换页面风格(简单版)
仿Vista进程条效果
用Javascript判断图片是否存在,不存在则显示默认图片的代码
用JQuery 实现的自定义对话框
jQuery使用手册之三 CSS操作
利用Dojo和JSON建立无限级AJAX动态加载的功能模块树
贴图转换+转贴工具用到的js代码超级推荐
超级简单的图片防盗(HTML),好用
现代 javscript 编程 资料
超级可爱纯js网页时钟
Dojo之路:如何利用Dojo实现Drag and Drop效果
AJAX架构之Dojo篇
发两个小东西,ASP/PHP 学习工具。 用JavaScript写的
使用prototype.js 的时候应该特别注意的几个问题.
一个已封装好的漂亮进度条
漂亮的widgets,支持换肤和后期开发新皮肤
用javascript实现的仿Flash广告图片轮换效果

Javascript 中的 JavaScript Event学习第十一章 按键的检测


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-02-27   浏览: 233 ::
收藏到网摘: n/a

检测用户的按键是事件处理程序的一个很特别的环节。这一章我们着力解决一些非常棘手的问题,并且制定一个完备的表格。 第一个问题是对于按键事件来说根本就没有标准,按照规范说的:包含键盘等输入设备的事件模型会在以后的DOM规范中作出解释。
正如我们了解到的,浏览器在最开始设计的时候并没有一个标准,大家都像做实验似的,最后的成品虽然是有用的,但是肯定造成了兼容性的问题。按键问题也不例外:这里有两个属性能检测到用户按下了什么键,虽然有足够的理由为什么需要两个属性,但是依然并不是所有的浏览器都支持。
另外,在keypress与keydown和keyup之间还有一些很重要的区别。
最后就是windows和mac的区别了,在mac上要检测用户按下了什么键简直比在windows下难了N倍。
keyCode和charCode
能检测到用户按下了什么键的两个属性就是keyCode和charCode了。简单说来:keyCode是用来检测用户真正按下了键盘上那个键的,而charCode则是给出键入字符的ASCII码。有一些小问题需要注意:大写的A和小写的a的keyCode是一样的,因为他们在键盘上就是一个键;但是charCode不一样,因为他俩是两个不同的字符。
IE和Opera不支持charCode。然而他们会在keyCode里面保存字符信息,但是只是在onkeypress的情况下,在onkeydown/up情况下包含的是键的信息。
字符和数字键
让我们以一个简单的例子开始。小写a的ASCII码是97,大写的是65。那么在两种情况下,当用户在键盘上敲下相同的键的时候,什么时候的键值是65呢(相当于大写的A)
keyCode

image

charCode

image
因此,在onkeydown/up的情况下,你能够从keyCode里面得到键值。在onkeypress情况下,想要得到字符值就要使用:evt.charCode || evt.keyCode.
标点符号
我还是决定不对标点符号键做测试了。我怀疑这不仅跟浏览器和操作系统有关,还可能跟键盘设置和默认语言有关。我一般用的是荷兰语版的windows,如果跟美国版的101键的键盘相比有很大出入,我一点都不会觉得意外。
比如说shift+,键出来的应该是<,但是我测试的ASCII码的结果却是'?'的。当我发现了这个问题,我决定还是不在标点符号键的问题上浪费时间了.
特别键
功能键就是只那些不能打印出来的但是却具有一定功能的键。比如shift、ESC、enter等等都是功能键。
一些说明:
1、一般,mac的可靠性比windows要差,有些键可能检测不到
2、IE不会触发下面这键的keypress事件:delete, end, enter, escape, 功能键, home, insert, pageUp/Down 和 tab。
3、在onkeypress事件下,Safari会给下面这些键给出很奇怪的keyCode值:delete, end, 功能键, home 和 pageUp.Down。但是在onkeydown/up下面就很正常。
4、Alt,Cmd,Ctrl和shfit键在mac上无法探测,不过Opera下面例外。然而你却可以使用altKey,ctrlKey,shfitKey这些属性。
如果你需要探测这些键,你就探测一下载onkeydown/up下面的keyCode就行了,算是给自己帮忙了,onkeypress和charCode就忘掉吧。
原文后面有个大的键值的列表,还有一个测试框,有兴趣的童鞋可以移步。
翻译地址:http://www.quirksmode.org/js/keys.html
转载请保留以下信息
作者:北玉(tw:@rehawk)