nput框在輸入切換中文輸入法時的輸入事件
1、compositionstart
compositionstart事件只有在輸入中文時才會觸發，觸發事件在input事件之前
2、compositionend
compositionend表示結束中文輸入時觸發的事件，不管最后輸入的是不是中文都會觸發
3、input
input事件就是最后輸入到輸入框的事件
4、如何應用這些事件
利用這些事件，可以在輸入中文的時候，保證在輸入完畢之后才執行input事件的代碼，不用每輸入一個字符就執行一次input事件的代碼了，如下圖
下面是我的代碼，做一下參考：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>input功能</title>
<script src="js/jquery-3.4.1.min.js"></script>
</head>
<body>
<input id="ahri" type="text"/>
<script>
$(() => {
let typing = false;
// 輸入中文之前
$('#ahri').on('compositionstart',function(event) {
console.log('compositionstart');
typing = true;
})
// 輸入中文之后
$('#ahri').on('compositionend',function(event) {
console.log('compositionend');
typing = false;
input(event);
})
// 真正輸入文字
$('#ahri').on('input',input)
function input(event) {
// 正在輸入中文時就不執行后面的代碼
if(typing) return;
console.log(event.target.value);
}
})
</script>
</body>
</html>
版權聲明：本文為CSDN博主「昔別一展鯤鵬意」的原創文章，遵循 CC 4.0 BY-SA 版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/nosuchobjecterror/article/details/93193229