如何将 Javascript keyCode 转换为 charCode？

Question

在Javascript键盘事件中，为按下的键提供了一个代码，但是，它不是 ASCII 或 UTF-8字符代码， 而是键盘按键的代码。有时 keyCodes 恰好与 ASCII/UTF-8 代码匹配，有时则不匹配。

有没有办法，给定一个 Javascript 键码（通过 e.keyCode 或 e.which 访问）得到相应的 ASCII 或 UTF-8 字符码？

Here's a working JSFiddle 来证明我的意思，或者运行下面的代码片段。

document.addEventListener("keyup", function(e) {

  document.querySelector(".key").innerHTML = e.key;
  document.querySelector(".keyCode").innerHTML = e.keyCode;
  document.querySelector(".UTF").innerHTML = String.fromCharCode(event.keyCode);

});

code {
  background-color: #e2aec8ab;
  border: solid 1px gray;
  border-radius: 3px;
  padding: 0 .5em;
  min-height: 1em;
  min-width: .2em;
  margin: 0 .1em;
}

.output {
  margin: 2em;
  border: solid 1px lightgray;
  border-radius: 3px;
  background-color: rgba(200, 250, 230, .3);
  padding: 1em;
}

Type here. Try some alpha letters as well as special keys like <code>`</code>
<code>-</code>
<code>=</code>
<code>[</code>
<code>]</code>
<code>[ENTER]</code>
<code>;</code>
<code>'</code>


<div class="output">
  You typed <code class="key"></code> which is Javascript <b></b>keyCode</b> <code class="keyCode"></code>, in UTF that would be <code class="UTF"></code>
</div>

两个例子：

在键盘上键入 2
捕获事件。 event.keyCode 是 50。
UTF字符50是2 (DIGIT TWO)

但是：

在键盘上键入 [
捕获事件。 event.keyCode 是 219。
UTF字符219为Û (LATIN CAPITAL LETTER U WITH CIRCUMFLEX)
我希望事件包含的字符代码是 91，对应于 LEFT SQUARE BRACKET。

如何将 Javascript 键码（例如 219）转换为 UTF-8 字符码（例如 91）？

Answer 1

我只想说，这个问题变成了一次有趣的学习冒险。但是....

您正在使用已弃用的 API。

事实证明 KeyboardEvent.keyCode 已被弃用一段时间。因为它使用十进制版本的 ASCII。正确的代码实际上是 event.Code。但这不是你想要的。

要获取 ascii 码，您可以使用 event.key.charCodeAt() 这确实有一些缺陷，因为当您按下 shift 时它会报告 S。但是你可以用event.location判断这个键是不是特殊的控制键。零是标准键，1-3 是特殊位置（我认为）。

document.addEventListener("keyup", function(e) {

  document.querySelector(".key").innerHTML = e.key;
  document.querySelector(".keyCode").innerHTML = e.code;
  document.querySelector(".ascii").innerHTML = e.key.charCodeAt()
  document.querySelector(".UTF").innerHTML = String.fromCharCode(event.key.charCodeAt());

});

code {
  background-color: #e2aec8ab;
  ;
  border: solid 1px gray;
  border-radius: 3px;
  padding: 0 .5em;
  min-height: 1em;
  min-width: .2em;
  margin: 0 .1em;
}

.output {
  margin: 2em;
  border: solid 1px lightgray;
  border-radius: 3px;
  background-color: rgba(200, 250, 230, .3);
  padding: 1em;
}

Type here. Try some alpha letters as well as special keys like <code>`</code>
<code>-</code>
<code>=</code>
<code>[</code>
<code>]</code>
<code>[ENTER]</code>
<code>;</code>
<code>'</code>


<div class="output">
  You typed <code class="key"></code> which is Javascript <b>keyCode</b> <code class="keyCode"></code>, in ASCII that would be <code class="ascii"> </code> which is <code class="UTF"></code>
</div>

如何将 Javascript keyCode 转换为 charCode？

How do you convert a Javascript keyCode to a charCode?

javascript

events

keycode

fromcharcode

dom-events

您正在使用已弃用的 API。