键值 keyCode事件属性

keyCode属性返回onkeypress事件触发的键值的字符代码，或onkeydown/onkeyup的键的代码。

两种代码类型的区别是：

字符代码 - 表示 ASCII 字符的数字

键盘代码 - 表示键盘上真实键的数字

HTML:

<code>&lt;</code><code>input</code> <code>type</code><code>=</code><code>"text"</code> <code>id</code><code>=</code><code>"test"</code> <code>onkeydown</code><code>=</code><code>"testKeyCode();"</code><code>&gt;</code>

JS:

<code>//按下回车键处理程序</code>

<code>function</code> <code>testKeyCode(){</code>

<code>    </code><code>var</code> <code>e = e||window.event; </code><code>//兼容IE浏览器，IE8将事件对象保存为一个全局变量event</code>

<code>    </code><code>console.log(e);</code>

<code>}</code>

把事件源对象打印出来，看看有哪些常见的属性

<a href="http://s1.51cto.com/wyfs02/M02/88/8A/wKiom1f7LSTiUXdTAADhAREPIyc765.png" target="_blank"></a>

现在想要知道按键对应的键值，我们可以这么做

JS：

<code>    </code><code>var</code> <code>e = e||window.event;</code>

<code>    </code><code>var</code> <code>x = e.keyCode; </code><code>//获取Unicode值,例如enter的keycode是13，A的keycode是65</code>

<code>    </code><code>console.log(x);</code>

<code>    </code><code>var</code> <code>y = String.fromCharCode(x);  </code><code>//将键值转换为字符</code>

<code>    </code><code>console.log(y);</code>

<code>    </code><code>var</code> <code>z = e.key;  </code><code>//key 事件在按下按键时返回按键的标识符</code>

<code>    </code><code>console.log(z);</code>

在页面输入框中分别输入a,回车键，大写字母键，右箭头键，查看控制台

<a href="http://s1.51cto.com/wyfs02/M00/88/87/wKioL1f7L1aBKwHqAACyb85b0oo888.png" target="_blank"></a>

附上Keycode完整的值列表

<a href="http://s5.51cto.com/wyfs02/M02/88/8B/wKiom1f7MTPT_bamAADs-Mp2AAQ806.png" target="_blank"></a>

本文转自   frwupeng517   51CTO博客，原文链接:http://blog.51cto.com/dapengtalk/1860203