翻译的Javascript键code成char code代表非美国键盘布局（即AZERTY） [英] Translate Javascript keyCode into charCode for non-U.S. keyboard layout (i.e. azerty)

问题描述

快速背景：

• 在当前的关键是在浏览器pssed $ P $，生成三个事件：的keydown 键preSS 和 KEYUP


• 的keydown 和 KEYUP 有键code 属性这大约是物理按键pressed。


• 键preSS 也有字符code 属性集，考虑到组合键和键盘布局（A和具有相同的密钥code，但不同的字符code）。


• 所有三个事件都表明哪些修饰键是那些事件中pssed $ P $属性。

• when a key is pressed in a browser, three events are generated: keyDown, keyPress and keyUp.
• keyDown and keyUp have a keyCode property which is approximately the physical key pressed.
• keyPress also has charCode property set which takes into account modifier keys and keyboard layout (A and a have same keyCode but a different charCode).
• all three events have properties that indicate which modifier keys were pressed during those events.

我的主要 noVNC 开发人员，我有一个棘手的问题：noVNC需要翻译的字符$ C $ ç无需使用键preSS值事件，原因如下：

I'm the main noVNC developer and I have a tough problem: noVNC needs the translated charCode value without using the keyPress event for the following reasons:

• noVNC需要单独发送该keydown和KeyUp事件到VNC服务器（否则它不是一个完全功能的VNC客户端）。


• 更重要的是，noVNC需要prevent默认的键盘操作，同时连接，这意味着调用的 preventDefault（）在的keydown 事件的方法。这样做的副作用也$ P $烧制而成pventing在键preSS 事件。

• noVNC needs to send the keyDown and keyUp events separately to the VNC server (otherwise it's not a completely functional VNC client).
• more importantly, noVNC needs to prevent the default keyboard actions while connected which means calling the preventDefault() method of the keyDown event. This has the side-effect of also preventing the keyPress event from firing.

由于键盘布局的差异（即不同的密钥code为char code映射），我已经决定noVNC将需要不同的键盘布局的查找表。

Due to differences in keyboard layouts (i.e. different keyCode to charCode mappings) I've determine that noVNC will need a lookup table for different keyboard layouts.

但是，这里是真正的问题：对备用布局后，一些不同的物理按键有同一个键code。例如，用 AZERTY （法语）键盘布局 - （破折号）和_下划线键都生成密钥code 189确认！

But here is the real problem: on alternate layouts, some different physical keys have the SAME keyCode. For example, with an azerty (French) keyboard layout the '-' (dash) and '_' underscore keys both generate keyCode 189. Ack!!!

所以...我如何得到正确的密钥code，同时为char code映射和prevent默认浏览器的行为？

So ... how do I get proper keyCode to charCode mapping and prevent default browser actions at the same time?

BTW，我怀疑的解决方案，这将是适用于其他交互式Web应用程序和HTML5的游戏，因为你经常希望能够了解而不会触发任何附加的浏览器响应该键$ pssed关键$ P $的全部信息p $ PSS。

BTW, I suspect the solution to this will be applicable to other interactive web applications and HTML5 games since you often want to be able to know full information about the key pressed without triggering any additional browser response to that keypress.

相关链接：

• 这里是一个有用的测试页面，展示了三个事件和其他一些有用的特性。


• 关键事件在Javascript疯狂状态的摘要（感谢@Tim）


• 按键


• - 关键事件


• noVNC问题这个问题的更多讨论。

• Here is an useful test page that show the three events and some other useful properties.
• Summary of the crazy state of key events in Javascript (thanks @Tim)
• Quirksmode Detecting keystrokes
• Quirksmode Events - key events
• noVNC issue with more discussion of the problem.

解决方案：参见下面的我的文章

Solution: see my post below.

推荐答案

我已经解决了我的问题。这不是一个100％的解决方案，但它应该涵盖最需要什么。但愿会有一个更清洁的解决方案时，浏览器厂商开始整合 DOM Level 3的活动的。

I have solved my own question. It's not a 100% solution but it should cover most of what is needed. Hopefully there will be a cleaner solution when browser vendors start integrating DOM Level 3 Events.

只是再次重申的主要制约因素：

Just to re-iterate the main constraints:

1. 的键并重点向上事件，应当报/在在实际发生时发送。即发送键并重点preSS活动期间一起键上是不够的。


2. 很多组合键必须在keyDown事件中得到充分的处理，或者是​​因为他们从来没有触发键preSS事件（如Ctrl键），或者因为默认动作必须的keydown（WebKit的）被停止，这样做$ P $从发生pvents关键preSS事件。


3. 的关键下来，关键事件应报告的转换字符code，而不是关键code值。

如果没有某种外的现成顿悟，当前浏览器的实现显得prevent被完全满足了所有三个约束。因此，我已决定放宽约束＃3只是有点。

Without some out-of-the-box epiphany, the current browser implementations appear to prevent all three constraints from being fulfilled completely. So I have decided to relax constraint #3 just a bit.

• 在浏览器中的的keydown 事件的事件添加到一个关键的下拉列表，检查，看它是否是一个安全（无不良浏览器的默认行为）组合键：

• On browser keyDown event add the event to a key down list and check to see if it is a safe (no undesirable browser default behavior) key combination:

• 安全：什么也不做，直到关键preSS

• Safe: do nothing until the keyPress.

不安全：报告/立即发送键按下事件。这是约束＃3是放松，因为这些有限的键组合不转换为字符code（其中许多人没有他们，虽然反正）。

Unsafe: report/send a key down event immediately. This is where constraint #3 is relaxed because these limited key combinations are not translated to a character code (many of them don't have them though anyways).

在浏览器中的键preSS 事件（其中keyDown事件之后立即发生）检查，看它是否是一个安全的组合键：

On browser keyPress event (which happens immediately after the keyDown event) check to see if it is a safe key combination:

• 安全：报告/发送键按下事件。使用转换字符code（event.which）更新键下拉列表中。

• Safe: report/send a key down event. Update the key down list using the translated character code (event.which).

不安全：什么也不做，因为它已经报道/ KEYDOWN期间发送

Unsafe: do nothing since it was already reported/sent during keyDown.

在浏览器中的 KEYUP 事件，找到并从键下拉列表中删除匹配的事件，并使用翻译code报告/发送键事件。

On browser keyUp event, find and remove the matching event from the key down list and use the translated code to report/send the key up event.

对于那些感兴趣的一些其他链接：

Some additional links for those interesting:

• noVNC提交的变化。


• 的票据作为有关noVNC的问题。


• 此解决方案有在红帽公司的 =HTTP ：//blogs.gnome.org/alexl/2011/03/15/gtk-html-backend-update/>百老汇项目（HTML5 GTK +后端）

• The noVNC commit with the change.
• Some wiki notes on the issues as related to noVNC.
• This solution has been adopted in RedHat's Broadway project (HTML5 GTK+ backend).

这篇关于翻译的Javascript键code成char code代表非美国键盘布局（即AZERTY）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！