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

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

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

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

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

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

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
});
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,486评论 19 139
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 14,223评论 4 61
  • 路上的人们都迈着飞快的脚步往前走,人们都在为了自己的某个理由而奔波,有的是梦想,有的也许只是一顿简单的温饱。 唐芬...
    不务正业的阿姨阅读 1,254评论 0 0
  • 昨天是“七夕”。讲老实话,如果不是网络上一片沸沸扬扬,商家借机炒作,加上央视新闻雄厚的男中音播报“今天是七夕”,我...
    周亚平阅读 3,025评论 0 0
  • 这个世界存在一种矛盾的事实,真理掌握在少数人手里,但是社会却顺从多数人意志。真理掌握在少数人手中,是一种典型的峰值...
    友才927阅读 3,342评论 0 2