Question

我想在keydown事件上读取输入字符并尝试处理它们。当我试图使用“String.fromCharCode（key）;”将它们转换为字符时它总是给我大写字母。

UPADTE：奇怪的是，如果我听“keypress”事件，代码就会起作用。这是什么原因。有人可以解释一下这个行为。

示例代码如下：

var inp = document.getElementById("ti");

inp.addEventListener("keydown", onKeyDown);

function onKeyDown(e) {
    if (window.event) {
        var key = window.event.keyCode;
    } else {
        var key = e.keyCode;
    }
    document.getElementById("output").innerHTML +=  String.fromCharCode(key);
}

在keydown事件中阅读字符的最佳做法是什么

Fiddle Demo

Answer 1

尝试使用keypress代替keydown

 inp.addEventListener("keypress", onKeyDown);

理论上，keydown和keyup事件表示按下或释放的键，而keypress事件表示正在键入的字符。在所有浏览器中，该理论的实现并不相同。

DEMO

Answer 2

猜猜你只需要将EventListener更改为keypress

var inp = document.getElementById("ti");

inp.addEventListener("keypress", onKeyDown);

function onKeyDown(e) {
    if (window.event) {
        var key = window.event.keyCode;
    } else {
        var key = e.keyCode;
    }
    document.getElementById("output").innerHTML += String.fromCharCode(key);
}

小提琴：http://jsfiddle.net/zZtW9/4/

看看这里，你可以注意到这里的差异： http://www.w3resource.com/html/attributes/HTML-event-attributes-completed.php

编辑：如有疑问，请查看： keyup event always return uppercase letter

Answer 3

我写了一个名为keysight的模块，它将keypress，keydown和keyup事件分别转换为字符和键。

示例：

 inp.addEventListener("keydown", function(event) {
    var character = keysight(event).char
    document.getElementById("output").innerHTML +=  character
 })

String.fromCharCode无法处理keydown事件

3 个答案: