中文输入法触发oninput事件解决办法

oninput事件 在移动端,中文输入的过程当中,输入框默认会显示英文字母,会触发oninput事件,但是输入还没有结束,所以会出现问题。
网上找了compositionstart和compositionend两个事件进行一个开关判断

compositionstart
当浏览器有非直接的文字输入时, compositionstart事件会以同步模式触发.

compositionend
当浏览器是直接的文字输入时, compositionend会以同步模式触发

解决办法 开始中文输入时会触发compositionstart事件,选词结束后会触发compositionend事件,忽略这两个事件之间的input事件



var node = document.querySelector('#sample');
var inputLock = false;
node.addEventListener('compositionstart', function(){
    inputLock = true;
})
node.addEventListener('compositionend', function(){
    inputLock = false;
    //if(!inputLock )console.log(this.value); 这里可以看情况用,我没用也可以。
})
node.addEventListener('input', function(){
    if(!inputLock )console.log(this.value);
    // do something hear
});

你可能感兴趣的:(中文输入法触发oninput事件解决办法)