compositionstart：compositionstart事件触发于一段文字的输入之前（类似于 keydown 事件，但是该事件仅在若干可见字符的输入之前，而这些可见字符的输入可能需要一连串的键盘操作、语音识别或者点击输入法的备选词）。
compositionend：当文本段落的组成完成或取消时, compositionend 事件将被触发 。
通俗点说：
是属于输入法和语音等键盘操作事件。
注意事项：
compositionend事件在input事件之后触发。
解决方案：
记录输入状态，默认通过input事件进行内容过滤，当为拼音输入时input事件跳过，等end事件进行内容过滤操作。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div> <input type="text" id="addressName"> </div> </body> </html> <script> // let flagCC = false let addressNameID = document.getElementById('addressName') addressNameID.addEventListener('compositionstart',function(){ flagCC = true; }) addressNameID.addEventListener('compositionend',function(val){ flagCC = false; console.log(val.target.value); }) addressNameID.addEventListener('input',function(val){ if(flagCC){return} console.log(val.target.value.length); }) </script>
参考
https://www.cnblogs.com/lstrive/p/11897106.html
https://www.bbsmax.com/A/q4zVDNp25K/