KeyboardEvent keyCode Property
Definition and Usage
The keyCode property returns the Unicode character code of the key that triggered the onkeypress event, or the Unicode key code of the key that triggered the onkeydown or onkeyup event.
The difference between the two code types:
- Character codes - A number which represents an ASCII character
- Key codes - A number which represents an actual key on the keyboard
These types do not always mean the same thing; for example, a lower case "w" and an upper case "W" have the same keyboard code, because the key that is pressed on the keyboard is the same (just "W" = the number "87"), but a different character code because the resulting character is different (either "w" or "W", which is "119" or "87") - See "More Examples" below to better understand it.
Tip: To find out if the user is pressing a printable key (e.g. "a" or "5"), it is recommended to use this property on the onkeypress event. To find out if the user is pressing a function key (e.g. "F1", "CAPS LOCK" or "Home") use the onkeydown or onkeyup event.
Note: In Firefox, the keyCode property does not work on the onkeypress event (will only return 0). For a cross-browser solution, use the which property together with keyCode, e.g:
Tip: For a list of all Unicode characters, please study our Complete Unicode Reference.
Tip: If you want to convert the returned Unicode value into a character, use the fromCharCode() method.
Note: This property is read-only.
Note: Both the keyCode and which property is provided for compatibility only. The latest version of the DOM Events Specification recommend using the key property instead (if available).
Tip: If you want to find out whether the "ALT", "CTRL", "META" or "SHIFT" key was pressed when a key event occured, use the altKey, ctrlKey, metaKey or shiftKeyproperty.
Example
Using onkeypress and onkeydown to demonstrate the differences between character codes and keyboard codes:
function uniCharCode(event) {
var char = event.which || event.keyCode;
document.getElementById("demo").innerHTML = "Unicode CHARACTER code: " + char;
}
function uniKeyCode(event) {
var key = event.keyCode;
document.getElementById("demo2").innerHTML = "Unicode KEY code: " + key;
}
When pressing the "a" key on the keyboard (not using caps lock), the result of char and key will be:
Unicode KEY code: 65

KeyboardEvent keyCode Property的更多相关文章
- Vue事件绑定原理
Vue事件绑定原理 Vue中通过v-on或其语法糖@指令来给元素绑定事件并且提供了事件修饰符,基本流程是进行模板编译生成AST,生成render函数后并执行得到VNode,VNode生成真实DOM节点 ...
- iOS WebCore的WebEvent和EventHandler
WebEvent是iOS专有的类,负责封装和携带从UIKit得到的系统事件信息,并由WebKit层的WAKResponder子类传递到WebCore的EventHandler. UIKit层的逻辑可参 ...
- node学习笔记之io.sockets
socket.get和socket.set函数已经失效,代码修改如下所示: 服务器端: var httpd = require('http').createServer(handler); var i ...
- 跨域(二)——WebSocket
严格地说,WebSocket技术不属于HTML5,这个技术是对HTTP无状态连接的一种革新,本质就是一种持久性socket连接,在浏览器客户端通过javascript进行初始化连接后,就可以监听相关的 ...
- csharp: Linq keyword example
/// <summary> /// http://www.dotnetperls.com/linq /// </summary> public partial class Li ...
- js原生创建模拟事件和自定义事件的方法
让我万万没想到的是,原来<JavaScript高级程序设计(第3版)>里面提到的方法已经是过时的了.后来我查看了MDN,才找到了最新的方法. 模拟鼠标事件MDN上已经说得很清楚,尽管为了保 ...
- [Angular] The Select DOM Event and Enabling Text Copy
When we "Tab" into a input field, we want to select all the content, if we start typing, i ...
- [Angular HTML] Implementing The Input Mask Cursor Navigation Functionality -- setSelectionRange
@HostListener('keydown', ['$event', '$event.keyCode']) onKeyDown($event: KeyboardEvent, keyCode) { i ...
- [Angular HTML] Overwrite input value, String.fromCharCode & input.selectionStart
@HostListener('keydown', ['$event', '$event.keyCode']) onKeyDown($event: KeyboardEvent, keyCode) { i ...
随机推荐
- SQL注入(字符型)
靶场:sqli-labs @SQLi最重要的一点:别上来就对着输入框注入,完整语句写出来,始终在语句中写完整的,最后把完整的一部分截取出来作为输入 @URL编码:为避免歧义,URL中,如 %2b ...
- MFC中使用ADO进行数据库操作
参考FROM:http://hi.baidu.com/sunkanghome/item/e1fda510b3186359f1090ee2 数据库与数据库编程: 当前各种主流数据库有很多,包括Oracl ...
- elasticsearch数据库(ES)
1. http://blog.csdn.net/cnweike/article/details/33736429 http://www.oschina.net/translate/elasticsea ...
- 洛谷P3381 最小费用最大流模板
https://www.luogu.org/problem/P3381 题目描述 如题,给出一个网络图,以及其源点和汇点,每条边已知其最大流量和单位流量费用,求出其网络最大流和在最大流情况下的最小费用 ...
- js复制文本
第一种: 自己测试时 只适合于input 和textarea 但是针对于其他标签的复制就不能用了.代码如下: <!DOCTYPE html> <html> <head&g ...
- [CF1146D]Frog Jumping_exgcd_堆优化dij
Frog Jumping 题目链接:http://codeforces.com/contest/1146/problem/D 数据范围:略. 题解: 首先发现,如果$x\ge a +b$,那么所有的$ ...
- lua 模块与包(五)
一.模块的介绍 模块类似于1个封装库,从Lua 5.1 开始,Lua加入了标准的模块管理机制,可以把一些公用的代码放在一个文件里,以API接口的形式在其他地方调用,用利于代码的重用和降低代码的耦合度. ...
- ORACLE initialization or shutdown in progress 错误解决办法
第一步,运行cmd 第一步.sqlplus /NOLOG第二步.SQL>connect sys/change_on_install as sysdba'/提示:已成功第三步.SQL>shu ...
- PostgreSQL练习3
select dname,count(ename),avg(sal),sum(sal) from emp e,dept d where e.deptno=d.deptno group by dname ...
- MyBatis学习存档(4)——进行CRUD操作
使用MyBatis进行数据库的CRUD操作有2种方式:一种如之前所说的接口+xml,而另一种是通过对接口上的方法加注解(@Select @Insert @Delete @Update) 但是通常情况下 ...