键盘事件拥有两个属性,keyCode和CharCode,他们之间有一些不一样之处。keyCode表示用户按下键的实际的编码,而charCode是指用户按下字符的编码。
IE下
keyCode:对于keypress事件,表示按下按键的Unicode字符;对于keydown/keyup 事件,表示按下按键的数字代码。无charCode属性。
DOM标准下
keyCode:表示按下按键的数字代码。
charCode:按下按键的Unicode字符。
 
当我按下“a”键(注意是小写的字母)时,
在火狐中会得到
keydown:keyCode is 65  charCode is 0
keypress:keyCode is 0   charCode is 97
keyup:  keyCode is 65  charCode is 0
在谷歌中会得到
keydown:keyCode is 65  charCode is 0
keypress:keyCode is 97  charCode is 97
keyup:  keyCode is 65  charCode is 0
在IE中会得到
keydown:keyCode is 65  charCode is undefined
keypress:keyCode is 97  charCode is undefined
keyup:  keyCode is 65  charCode is undefined
而当我按下shift键时,
在火狐中会得到
keydown:keyCode is 16  charCode is 0
keyup:  keyCode is 16   charCode is 0
不会得到任何的charCode值,因为按shift并没输入任何的字符,而且也不会触发keypress事件。
在谷歌中会得到
keydown:keyCode is 16  charCode is 0
keyup:  keyCode is 16   charCode is 0
在IE中会得到
keydown:keyCode is 16  charCode is undefined
keyup:  keyCode is 16   charCode is undefined
小结:
1.在keydown事件里面,事件包含了keyCode – 用户按下的按键的物理编码。
2.在keypress里,keyCode包含了字符编码,即表示字符的ASCII码。这样的形式适用于所有的浏览器 – 除了火狐,它在keypress事件中的keyCode返回值为0。
如果你想获取用户实际敲击的按钮,用keydown事件来获取事件对象,并获取keyCode值,这在所有浏览器都行的通。另一方面,如果你想获取用户输入的字符,那么就使用keypress来获取,然后获取charCode(火狐和safari)或是keyCode(其他浏览器)。
 
 
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>keyCode属性-蚂蚁部落</title>
<script type="text/javascript">
/*function keyEvent(ev){
var ev=ev||window.event; alert(ev.keyCode);
} document.onkeydown=keyEvent; */ function keyEvent(ev){
var ev=ev||window.event; alert(ev.charCode);
}
document.onkeypress=keyEvent;
//火狐下onkeypress a-------97 ,onkeydown a --------0
//火狐下onkeypress b-------98 ,onkeydown b --------0 var getCharCode = function(ev){
var ev=ev||window.event;
if (typeof ev.charCode == "number"){
alert(ev.charCode);
return ev.charCode;
} else {
alert(ev.keyCode);
return ev.keyCode;
}
} document.onkeydown=getCharCode;
//a--------65
//b--------66 </script>
</head>
<body>
</body>
</html>

由于浏览器差异键值输出差异,给出个兼容获取键值的方法

var getCharCode = function(ev){
var ev=ev||window.event;
if (typeof ev.charCode == "number"){
//alert(ev.charCode);
return ev.charCode;
} else {
//alert(ev.keyCode);
return ev.keyCode;
}
}
 

keyCode 与charCode的更多相关文章

  1. js获取键盘按下的键值event.keyCode,event.charCode,event.which的兼容性

    js获取键盘按下的键值有event.keyCode,event.charCode和event.which 其中: 谷歌浏览器对event.keyCode,event.charCode和event.wh ...

  2. java Script 中的keyCode 和charCode

    其实很长一段时间,我都没有完全弄明白keyCode 和charCode ,自己也认真看过,但是就是理解不透彻,为了防止以后再出现混乱,写篇博客记录一下吧! 首先  在不同的浏览器中,他们有不同的说法哦 ...

  3. javascript中keyCode与charCode属性

    好记性不如烂笔头啊,最近总是忘记这两个属性的区别.想了想,从别人博客上转一遍过来吧,时常看下 键盘事件拥有两个属性,keyCode和CharCode,他们之间有一些不一样之处.keyCode表示用户按 ...

  4. JS键盘事件对象之keyCode、charCode、which属性对比

    先说一些有关键盘事件的事项:用js实现键盘记录,要关注浏览器的三种按键事件类型,即keydown,keypress和keyup,它们分别对应onkeydown. onkeypress和onkeyup这 ...

  5. keypress和keydown事件及keyCode和keyChar

    二:keypress和keydown事件: 现只在IE10.chrome(版本 32.0.1700.107 m).firefox(25.0.1)中测试了.   IE8 chrome firefox $ ...

  6. js中获取event keycode的兼容办法

    window.onkeypress=function(e){ var event = e || window.event, //在ff下event会做为参数传进来,ie下会在window下 keyCo ...

  7. js/jquery键盘事件及keycode大全

    js/jquery的键盘事件分为keypress.keydown和keyup事件 一.键盘事件 1.keydown()事件当按钮被按下时,发生 keydown 事件. 2.keypress()事件ke ...

  8. python之前端

    一.Html总结 1.Html简介 HTML 是一种标记语言 忽略大小写,语法宽松 使用 HTML 标记和元素,可以: 控制页面和内容的外观 发布联机文档 使用 HTML 文档中插入的链接检索联机信息 ...

  9. JS事件模型小结

    三种事件模型:原始事件模型(DOM0),DOM2事件模型,IE事件模型: 不同点: 事件程序的注册(给HTML元素所对应的JS对象绑定事件) 事件传播的过程 事件模型的注册: 一.原始事件模型(没有兼 ...

随机推荐

  1. 解决 ko mapping 数组无法添加新对象的问题

    这两天页面模板化的进程有些放缓,使用 ko mapping 插件的情形多了起来.组员经常问到的问题即是往 ko mapping 数组添加新对象时,报找不到方法的错误:而使用 ko.observable ...

  2. PHP Session可能会引起并发问题

    在进行Web应用程序开发的时候,人们经常会用Session存储数据.但可能有人不知道,在PHP中,Session使用不当可能会引起并发问题.印度医疗行业软件解决方案提供商Plus91 Technolo ...

  3. .resources文件转.resx 文件

    最近在进行.net winform应用程序的反向工程,资源文件反向出来后都是.resources文件,工程编译和运行都没有问题,但.resources文件为二级制文件,无法在Visual Studio ...

  4. hbase 学习笔记二----shell

          Hbase 是一个分布式的.面向列的开源数据库,其实现是建立在google 的bigTable 理论之上,并基于hadoop HDFS文件系统.     Hbase不同于一般的关系型数据库 ...

  5. Linux下音频编程-输出音频文件

    程序实现了在Linux下播放Ok.wav的功能.程序首先调用fstat函数获得文件相关信息(主要是文件大小信息).通过malloc函数分配指定的内存空间,并将online.wav读入内存:然后,打开声 ...

  6. Windows Myeclipse 10 安装 Perl 插件

    1.首先安装 windows 下的 perl 环境这里使用 active perl,选择最新版本 5.16.1下载地址:http://www.activestate.com/activeperl/do ...

  7. zoj 3822 Domination (概率dp 天数期望)

    题目链接 参考博客:http://blog.csdn.net/napoleon_acm/article/details/40020297 题意:给定n*m的空棋盘 每一次在上面选择一个空的位置放置一枚 ...

  8. java.util.logging.Logger使用详解

    一.创建Logger对象   static Logger getLogger(String name)           为指定子系统查找或创建一个 logger. static Logger ge ...

  9. 瞎折腾之Mvc WebApi的使用以及跨域问题

    在公司经常会用到调用接口的情况,但是一直是用的webservice,我感觉真是太笨重了.虽然某些人感觉用的很爽.非常爽.比如说:公司在开发的时候需要对接另一组的接口,然后就只能是指定端口和ip到他的电 ...

  10. Balsamiq Mockups简单介绍(UI草图绘制工具)

    什么是Balsamiq Mockups Balsamiq Mockups出自加利福尼亚州的Balsamiq工作室,创始人Peldi在2008年6月推出了这款手绘风格的产品原型设计工具,并广受好评.2年 ...