keypress和keydown事件及keyCode和keyChar
二:keypress和keydown事件:
现只在IE10、chrome(版本 32.0.1700.107 m)、firefox(25.0.1)中测试了。
IE8 | chrome | firefox | |
$(document).keydown() | yes | yes | yes |
$('window').keydown() | no | yes | yes |
$('body').keydown() | no | yes | yes |
keypress的表现与上表一致。
不仅keypress和keydown得到的按键值不同,不同浏览器的返回值event.keyCode、event.charCode也不同:
Q键 | q键 | Caps Lock键 | Tab键 | 左方向键 | 数字1键 | Enter键 | 空格键 | F5键 | |||||||||||
key down |
key press |
key down |
key press |
key down |
key press |
key down |
key press |
key down |
key press |
key down |
key press |
key down |
key press |
key down |
key press |
key down |
key press |
||
IE10 | keyCode | 81 | 81 | 81 | 113 | 20 | -- | 9 | -- | 37 | -- | 49 | 49 | 13 | 13 | 32 | 32 | 116 | -- |
charCode | 0 | 81 | 0 | 113 | 0 | -- | 0 | -- | 0 | -- | 0 | 49 | 0 | 13 | 0 | 32 | 0 | -- | |
chrome | keyCode | 81 | 81 | 81 | 113 | 20 | -- | 9 | 9 | 37 | -- | 49 | 49 | 13 | 13 | -- | 32 | 116 | -- |
charCode | 0 | 81 | 0 | 113 | 0 | -- | 0 | 9 | 0 | -- | 0 | -- | 0 | 13 | -- | 32 | 0 | -- | |
firefox | keyCode | 81 | 0 | 81 | 0 | 20 | -- | 9 | 9 | 37 | 37 | 49 | 0 | 13 | 13 | 32 | 0 | 116 | 116 |
charCode | 0 | 81 | 0 | 113 | 0 | -- | 0 | 0 | 0 | 0 | 0 | 49 | 0 | 0 | 0 | 32 | 0 | 0 |
(还有一个event.whice:A non-standard property, the hybrid of charCode and keyCode, with the sole purpose to confuse a developer.
But in the zoo of key events it also plays a good role. Particulary, it helps to get the character. )
还有一些属性:shiftKey, ctrlKey, altKey, metaKey,布尔类型的值,检测按键是否是shift、ctrl、alt、Command(Mac only).
可以看出对于keyCode:
keydown几乎对所有按键都有返回值,且对大小写字母的返回值相同;
kepress似乎对只对字母按键有返回值,且对大小写字母的返回值不一样.
关于keydown、keypress、keyup的区别,参考http://javascript.info/tutorial/keyboard-events,上面写的很详细,摘录如下:
对于keydown,任何按键事件都能触发它,并返回scan-code(按键本身固有的数字代码,所有同一个键的scan-code肯定相同);
对于keypress,只保证character keys(字符按键)事件能触发它,并返回char-code(按键的unicode字符,区分大小写按键,charCode只在keypress中返回。js中的str.charCodeAt() 方法就可返回指定位置的字符的 Unicode 编码)。
For all keys except ';', '='
and '-'
different browsers use same key code.。
看了上面的表是不是觉得有点......,参考网页中还给出了keypress的事件代码
如何获取键入的字符值和数字值:
// only keypress event
function getChar(event) {
if (event.which == null) {
return String.fromCharCode(event.keyCode) // IE
} else if (event.which!=0 && event.charCode!=0) {
return String.fromCharCode(event.which) // the rest
} else {
return null // special key
}
}
测试IE10、chrome、firefox有效。
由于String.fromCharCode对special keys 会返回weird results.所有不能直接return String.fromCharCode(event.keyCode||event.charCode)。
如何获取包含特殊键在内的组合键:
以ctrl+e为例:
document.onkeydown = function(e) {
e = e || event;
if ((e.ctrlKey && e.keyCode == 'E'.charCodeAt(0)) ) {
//do something
}
由于keyCode对大小写字符返回的都是大写字母值,所以e.keyCode == 'E'.charCodeAt(0)对e和E都能识别。
测试IE10、chrome、firefox有效。(如果先按住E,再同时按ctrl,则都无效)
keypress和keydown事件及keyCode和keyChar的更多相关文章
- javascript 中 keyup、keypress和keydown事件
keyup.keypress和keydown事件都是有关于键盘的事件 1. keydown事件在键盘的键被按下的时候触发,keyup 事件在按键被释放的时候触发 keydown.keypress ...
- js keyup、keypress和keydown事件
js keyup.keypress和keydown事件都是有关于键盘的事件 当一个按键被pressed 或released在每一个现代浏览器中,都可能有三种客户端事件. keydown event k ...
- js keyup、keypress和keydown事件 详解
js keyup.keypress和keydown事件 详解 js keyup.keypress和keydown事件都是有关于键盘的事件 当一个按键被pressed 或released在每一个现代浏 ...
- 转载关于KeyPress和KeyDown事件的区别和联系
KeyDown:在控件有焦点的情况下按下键时发生. KeyPress:在控件有焦点的情况下按下键时发生. KeyUp:在控件有焦点的情况下释放键时发生. 1.KeyPress主要用来接收字母.数字等A ...
- C#学习笔记-KeyDown、KeyPress、KeyUp事件以及KeyCode、KeyData、KeyValue、KeyChar属性
本来没打算单独写的,但是在自己弄测试小程序的时候,越写发现不清楚的东西越多,所以实践又一次证明:纸上得来终觉浅,绝知此事要躬行! 直接贴代码了: //发生顺序:KeyDown->KeyPress ...
- js获取浏览器的keydown事件(附keycode码)
<script type="text/javascript" language=JavaScript charset="UTF-8"> docume ...
- C# 如何捕获键盘按钮和组合键以及KeyPress/KeyDown事件之间的区别 (附KeyChar/KeyCode值)
1. 首先将窗口属性KeyPreview设为true,如果属性对话框中找不到,就直接在代码里添加: 2. 添加KeyPress / KeyDown事件: 1.KeyPress 和KeyDown .Ke ...
- Winform下KeyDown,KeyPress,KeyUp事件的总结(转)
原文: http://www.cnblogs.com/xiashengwang/archive/2011/09/15/2578798.html 在winform程序中,经常会用到这几个事件用于控制数字 ...
- C#控件中的KeyDown、KeyPress 与 KeyUp事件浅谈
研究了一下KeyDown,KeyPress 和 KeyUp 的学问.让我们带着如下问题来说明: 1.这三个事件的顺序是怎么样的? 2.KeyDown 触发后,KeyUp是不是一定触发? 3.三个事件的 ...
随机推荐
- Date对象
<script type="text/javascript"> /* 日期对象(Date) */ var date = new Date(); //获取到当前的系统时间 ...
- Docker for Windows
Docker for Windows使用简介 在上一篇文章中,通过演练指导的方式,介绍了在Docker中运行ASP.NET Core Web API应用程序的过程.本文将介绍Docker for Wi ...
- 深拷贝与浅拷贝(mutableCopy与Copy)详解 iOS
深拷贝与浅拷贝(mutableCopy与Copy)详解 iOS ios中并不是所有的对象都支持copy,mutableCopy,遵守NSCopying 协议的类可以发送copy消息,遵守NSMutab ...
- CentOS 6.5 + Nginx 1.8.0 + PHP 5.6(with PHP-FPM) 负载均衡源码安装 之 (三)Nginx负载均衡配置
Nginx反向代理到单个PHP-FPM(PHP-FPM可位于不同机器) 0.首先,创建我们的网站根目录[注:须在PHP-FPM所在的那台机器创建](以后网站的代码放到此目录下): mkdir /opt ...
- openwrt上wifi探针的实现
openwrt上wifi探针的实现 探针是通过wifi搜集经过这个AP范围的手机的mac地址,没有什么深刻的东西,知乎上关于这个东西讨论的很多,有人觉得很有用,可以做很多增值的应用,有人觉得没啥用,不 ...
- Android ListView特别属性用法
由于这两天在做listView的东西,所以整理出来一些比较特别(不常用)的属性,通过设置这样的属性可以做出更加美观的列表 1.stackFromBottom属性,这只该属性之后你做好的列表就会显示你列 ...
- HDU_1238——最大子串搜索
Problem Description You are given a number of case-sensitive strings of alphabetic characters, find ...
- Nginx缓存解决方案:SRCache
前些天帮别人优化PHP程序,搞得灰头土脸,最后黔驴技穷开启了FastCGI Cache,算是勉强应付过去了吧.不过FastCGI Cache不支持分布式缓存,当服务器很多的时候,冗余的浪费将非常严重, ...
- Jquery css函数用法(判断标签是否拥有某属性)
判断一个层是否隐藏:$("#id").css("display")=="none" ;在所有匹配的元素中,设置一个样式属性的值:$(&qu ...
- DedeCMS源码安装
一.源码下载地址 可以从以下网站下载DedeCMS源码进行安装,这里我下载了AB模板网的一个服装网站源码来演示DedeCMS源码的安装 http://www.adminbuy.cn/dedecms/2 ...