Question

问题：如何在keypress / keydown之后检测到要插入输入字段的字符？

后台：我正在创建一个输入字段，该字段在用户输入时动态扩展和缩小。为了流畅地执行此操作，我需要在呈现字符之前立即重绘。为了重绘到正确的宽度，我需要知道即将插入的字符。使用keyup然后使用.val（）会创建一个抖动界面，因为在文本向右移动之前不会更改宽度。

探索方法：

这就是我现在正在使用的，但它并不是因为它不是一个准确的映射，特别是对于特殊字符。

        // Convert the keypress to the appropriate letter
        self.lastLetter = String.fromCharCode(e.keyCode);
        self.lastLetter = e.shiftKey?self.lastLetter:self.lastLetter.toLowerCase();

Answer 1

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

Keysight重新生成具有key属性和char属性的对象。 key属性表示要键入的字符，它考虑了大写字母。 element.addEventListener("keydown", function(event) { var character = keysight(event).char if(character === 'w') { console.log("got lower case w") } else if(character === 'W') { console.log("got upper case W") var key = keysight(event).key console.log("keysight(event).key is still lower case "+key) } })属性表示键盘上的键，不代表大写或小写 - 只是键。

示例：

{{1}}

Answer 2

很难确定您发布的小片段，但看起来您正在尝试将字符代码映射到字符。 keypress事件确实传递了字符代码。但是，keydown（和keyup）事件会传递扫描代码而不是字符代码。这样他们就可以传递不代表字符的键击（例如箭头键，热键等）。您可以在此blog post中找到扫描代码表，但请注意它们是浏览器和操作系统特定的。

检测在keydown上输入到输入字段的字符

2 个答案: