国际键盘如何与JavaScript键盘事件一起使用？

 

我用JavaScript编写了一个直接绘制到Canvas元素的文本编辑器（出于各种原因，但我的主要原因是我可以将该画布作为纹理贴在WebGL网格上）。 令人惊喜的是，实现我找到的任何可编辑内容的解决方案都变得更加容易。

我很早就注意到的一件事是，除了en-US QWERTY以外的键盘布局的人抱怨某些键显示不正确的字母。 在对Windows的语言设置和屏幕键盘进行了一些摆弄之后，我创建了一个基于代码页的解决方案，它将keyCode直接映射到不同语言环境的字符串，而不是假定“没有修饰键的keyCode 51是数字3 ”。 因为它不是，在某些键盘上它是双重的。

但还是有些古怪。 几个例子（请注意，所有这些例子都基于使用Windows屏幕键盘，所以我只是假设这与现实相关）：

  • 当输入字母U时， 法语AZERTY键盘会发送keyDown和keyPressed事件，但不会发生keyUp。 我假设U必须与另一个密钥相结合，但不知道正确的行为应该是阻止我编写正确的代码。 编辑：我还没有弄清楚这意味着什么，除了 - 也许 - 这个键只用于整个法语的一个词？
  • 德国的QWERTZ键盘有一个^（不是插入符号，它看起来更大）键，其中'（反向）键将位于美式键盘上，还有一个反向键，其中=（等于）键将位于美式键盘上。 在这两种情况下，他们都会发送keyDown和keyUp事件，但不会在我使用的任何文本编辑器中打印任何内容，直到他们再次被点击，然后打印两个字符。 这与标记结合有关吗？ 我找不到任何关于它的事情。 编辑：这些被称为死钥匙，他们创造重音字母。 很多键盘布局都有它们。 我将为此创建一个按键排序系统，这将有助于为更复杂的Emacs风格的键盘快捷键提供支持（如果有的话）。
  • 英国QWERTY键盘有一个反斜杠，需要使用ALT-GRAPH键（美式键盘上的右键Alt键）。 KeyboardEvent的位置属性可用于确定哪些ALT键被按下，但它显然在Safari中不可用。 这是相当低的优先级，因为Safari通常只占我的流量的1％或更少。 但是，是否有适用于Safari的属性，我可以用作后备？ 编辑：我将处理此问题，因为我的代码页系统的其余部分适用于小写和大写键之间的区别。 这只是一个新的修改键的不同代码页。 我将不得不改变如何检测修改键，但这只是一个小改变，并且很容易适合键盘快捷键系统。
  • 最后，从Windows的语言设置来看，世界上有很多不同的键盘布局。 有没有任何地方的键码和行为的清单？ 我宁愿不必手动测试每个键盘，只为它们生成一个新的代码页。

    • 前两个问题是最大的。 如果我只知道行为应该是什么，我可以找出解决方案。 第三个问题将适合我的代码页系统，但我必须改变我读取修改键的方式。 最后一个问题，我可能会付钱给某人报道。

    而且我无法在100％的时间内为所有浏览器中的所有用户解决问题。 但我遇到的大部分信息基本上都是“不要打扰”，这听起来更像“我不知道”。

    编辑：选择布局不是一个问题。 如果事情不适合他们，我将它作为用户选项提供。 我认为这是在这种情况下可以做的最好的事情，但显然如果可以的话我会自动检测。 考虑到已经选择了正确的布局，我真的只关心如何获得正确的行为。

    我想避免任何涉及keyPress事件的事情，因为它不是完全可靠的。 如果我在键盘布局上有可靠的数据来源，这不会是一个问题。

    你无法获得键盘布局...

    （用纯JS解决方案）无法检测用户的键盘布局。

    请注意，“en-US”或“en-GB”不映射到这些语言的任何特定/同意的键盘布局。 用户的语言与他们的键映射到角色的方式无关。

    您可以根据语言环境/语言代码进行假设，但这不能提供任何保证 - 它只会增加您适应适当布局的可能性。

    另请参阅以下问题：

    将Javascript keyCode转换为非美国键盘布局的charCode（即azerty）

    用javascript检测键盘布局

    ...但你可以得到与它一起输入的字符：

    但是，根据您所需的浏览器支持（使用画布，应该是相当不错的），您可以尝试使用charCode属性：

    http://www.w3schools.com/jsref/event_key_charcode.asp 

    var unicodeCharCode = e.charCode;

    请注意，这不会返回实际的字符 - 您会得到表示它的数字（不是关键字）：

    Unicode字符代码是一个字符的编号（例如数字“97”代表字母“a”）。

    您可以根据需要轻松将这些代码映射到字符，或者只使用内置函数： 

    var userInput = String.fromCharCode(unicodeCharCode);
  • 聪明/为自己工作，你也可以（相当平凡）编写一个库来猜测charCode返回的某个keyCode的键盘布局。 不要通过:)

    • 替代方法：

    一个建议用作解决方法是使用隐藏的（或至少离散的）文本输入/文本框，这是您的应用程序集中的焦点。

    当您的应用程序检测到按键/按键等时，您可以获取用户输入的值并将其呈现在画布上。

    由于您已经捕获了键盘事件，处理组合应该很容易（如果需要的话）。 在某些方面甚至不需要，因为您只需要监视用户输入的输入长度（您的应用程序无需关心用户是否需要三键组合才能输入角色，您只需抓住结果）。

    链接地址: http://www.djcxy.com/p/18435.html

    上一篇: How do international keyboards work with JavaScript keyboard events?

    下一篇: Why XGrabKey generates extra focus