MDN is very vague about what the CompositionEvent means .没有示例和相关事件，例如compositionstart , compositionupdate和 compositionend , 也没有例子，也没有更好地解释它。
引用 MDN:
The DOM CompositionEvent represents events that occur due to the user indirectly entering text.
并且，对于事件:
The compositionstart event is fired when the composition of a passage of text is prepared (similar to keydown for a keyboard input, but fires with special characters that require a sequence of keys and other inputs such as speech recognition or word suggestion on mobile). [...] Gecko fires this event when IME starts composition, and some platforms don't have an API for canceling composition once it's begun.
This answer声明 CompositionEvents 主要用于非拉丁字符(例如当用户输入日文字符时)。我认为任何需要 IME(= 输入法？)的东西都可以触发这些组合事件。我只使用拉丁字符，所以我猜我从未使用过 IME。尽管 IME 显然也与 Android 键盘的组成有关。
我的问题:CompositionEvents 的用途是什么，这些事件何时触发？请举例说明其用途。还有:它可以用来组成 unicode 字符，例如 ô、ç 和 ü 吗？
最佳答案
合成事件
Composition Events 提供了一种以补充或替代方式输入文本的方法，而不是键盘事件，以便允许使用键盘上可能不常见的字符。例如，组合事件可用于向字符添加重音符号，尽管标准美国键盘不包含这些字符，从其基本组件或类别构建许多亚洲语言的语标，从移动设备上的按键组合中选择单词选项键盘，或使用语音识别处理器将语音命令转换为文本。引用§5 Keyboard events and key values有关组合事件如何与键盘事件结合使用的示例。
从概念上讲，一个组合 session 由一个 compositionstart 组成事件，一个或多个compositionupdate事件和一个compositionend事件，值为 data在每个 session 期间在此事件链的每个阶段之间持续存在的属性。
Note: While a composition session is active, keyboard events can be dispatched to the DOM if the keyboard is the input device used with the composition session. See the compositionstart event details and IME section for relevent event ordering.
不是所有IME系统或设备向 DOM 公开必要的数据，因此事件组合字符串(阅读窗口或候选选择菜单选项)可能无法通过此界面获得，在这种情况下，选择可能由 empty string 表示.
引用: https://www.w3.org/TR/uievents/#events-compositionevents
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CompositionUpdate</title>
</head>
<body>
<input id="input">
<pre id="log"></pre>
<script>
var input = document.getElementById('input')
, log = document.getElementById('log')
;
['compositionstart', 'compositionupdate', 'compositionend', 'keydown']
.forEach(function (event) {
input.addEventListener(event, function (ev) {
log.textContent += event + ': ' + (ev.data || ev.keyCode) + '\n';
}, true);
})
;
</script>
</body>
</html>运行上面的 HTML 文件，并在我的 Mac 键盘上输入 à (Alt-`, a) 我得到以下结果:
Gecko | Chromium | WebKit
----------------------------- | ----------------------------- | ---------------------------
`keydown`: 18 | `keydown`: 18 | `keydown`: 18
`keydown`: 192 | `keydown`: 229 | `compositionstart`: 0
`compositionstart`: undefined | `compositionstart`: undefined | `compositionupdate`: \`
`compositionupdate`: \` | `compositionupdate`: \` | `keydown`: 229
`compositionupdate`: à | `keydown`: 229 | `compositionend`: à
`compositionend`: à | `compositionupdate`: à | `keydown`: 229
| `compositionend`: à |
我使用 keyCode 而不是 key 因为 WebKit。 keydown 值之间的区别并不那么重要。这
事件顺序的差异，以及 Firefox 在组合启动后不会触发 keydown 的事实，Chrome 在中间给你一个，而 Safari 在最后抛出一个额外的，这很有趣!
关于javascript - 什么是 JavaScript 的 CompositionEvent？请举例说明，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51226598/