Inputイベント互換処理および中国語入力法の最適化

問:移動端js inputイベントが入力漢字をどのように解決するかというと、ピンインは入力ボックス内でもinputイベントをトリガーします.漢字がまだ生成されていない場合、これはピンインであり、入力ボックス内でinputをトリガーします.どうやって避けるの?
答:oninputはHTML 5の標準イベントであり、textarea、input:text、input:password、input:searchのいくつかの要素がユーザーインタフェースを通じて発生するコンテンツの変化を検出するのに非常に役立ち、コンテンツの修正後すぐにトリガーされ、onchangeイベントのように焦点を失ってから触れる必要はありません.oninputイベントはie 9+と互換性があり、ieの下でonpropertychangeイベントがこのセクションの内容ではないことができます.
bug

IE 9では、チェックアウト/削除/切り取り入力イベント(IE 9 doesn’t fire input event on backspace/del/cut)

はトリガーされません.

ユーザの現在の入力方式状態が中国語である場合、フレーズが選択されていない入力ボックスでもイベント

がトリガーされる.
要素にcut,keyup,イベント例を追加するには、次のようにします.

_.on(el,'input',this.listener)
// IE9 doesn't fire input event on backspace/del/cut
if(_.isIE9){this.onCut =function() {        
    _.nextTick(self.listener)
}
this.onDel =function(e) {
    if(e.keyCode ===46|| e.keyCode ===8) {            
        self.listener()
    }
}    
_.on(el,'cut',this.onCut)   
_.on(el,'keyup',this.onDel)}

vuejs:中国語入力最適化から、フレーズが入力ボックスに入ってこそイベントがトリガーされるという結果が得られます.2つの新しいイベントを使用して、予想される効果を達成することができます.compositionstartとcompositionndも、ie 9+の互換性に最適です.
MDN:compositionstartブラウザに直接でない文字入力がある場合、compositionstartイベントは同期モードでトリガーされます.compositionndブラウザが直接の文字入力である場合、compositionndは同期モードでトリガーされます.
2つのイベントを見て分かるように、要素にこの2つのイベントを追加し、次のようにスイッチを入れます.html:

<input type="text" id="person" />

js:

var node = document.querySelector('#person');
var cpLock = false;
node.addEventListener('compositionstart', function(){
    cpLock = true;
})
node.addEventListener('compositionend', function(){
    cpLock = false;
    if(!cpLock) console.log(this.value);
})
node.addEventListener('input', function(){
    if(!cpLock) console.log(this.value);
});