阻止中文输入时触发input事件

做限制输入框可输入最大的长度和实时匹配输入框数据时遇到了坑 —— 当中文输入时input事件也会被触发，即假设限制的是2个字符，你要输入社会人的“社（she）”，就会直接被截取，输入框填充文本sh。或者是在中文输入法时也会一直去调接口，匹配数据，影响了页面的性能！代码如下：

$(document).on('input','input',function(){console.log('限制最大输入字符（截取）')
})

这个问题，可以声明一个inputFlag，使用compositionstart,compositionend配合解决，代码如下：

var inputFlag = true
$(document).on('compositionstart', 'input',function () {inputFlag = true
}).on('compositionend','input',function () {inputFlag = false
}).on('input','input', function () {//定时器内才会生效 注意：定时器内this指向已发生改变setTimeout(function(){if (inputFlag == false) return   // 中文输入过程中不截断console.log('限制最大输入字符（截取）')})})

阻止中文输入时触发input事件相关推荐

如何避免输入中文拼音时触发input事件?
如何避免输入中文拼音时触发input时间 <!DOCTYPE html> <html lang="en"> <head><meta cha ...
处理打拼音时触发input事件bug
1 /* 处理预输入,例如输入中文汉字时,拼音的预加载不触发输入事件*/ 2 var cpLock = false; 3 /* 添加搜索延迟*/ 4 var timeoutId = 0; 5 6 /* ...
vue中解决模糊搜索输入中文时--未输入完成时触发input事件
在给输入框绑定input或keydown事件时预期效果是有输入法时,输入中文后触发事件,不希望输一个字母就触发一次事件可以用到compositionstart,compositionend. 主流 ...
阻止中文输入法输入拼音的时候触发input事件
阻止中文输入法输入拼音的时候触发input事件前言最近看element-ui源码的时候看到el-input发现的.这个少见的事件. compositionstart.compositionend事 ...
input输入中文时，拼音在输入框内会触发input事件的问题
问题描述: 监听文本输入框的input事件,在拼写汉字(输入法)但汉字并未实际填充到文本框中(选词)时会触发input事件,如图: 需求:选词完成后触发input事件,只触发一次. 解决办法: 通过查 ...
【h5】ios自带输入法输入中文时多次触发input事件的处理
实现移动端的即时搜索的时候监听input事件掉接口查询,但是在ios设备上遇到了问题,使用ios自带输入法输入汉字时,会出现输入一个字母就触发一次事件,导致频繁调用接口的问题. 如果是输入纯英文没什么 ...
即时搜索：对于ios自带输入法输入中文时多次触发input事件的处理
实现移动端的即时搜索的最佳方案,一定是使用input propertychange事件了,但是在ios设备上遇到了问题,使用ios自带输入法输入汉字时,会出现多次触发input事件的情况,一开始可能由 ...
解决input中输入中文过程中会触发input事件的问题
问题描述: 监听文本输入框的input事件,在拼写汉字时会触发input事件,如下图: 需求: 选词完成后触发input事件,只触发一次. 解决办法: 通过查阅资料得知在输入中文(包括语音识别时)会先 ...
中文输入法不触发onkeyup事件的解决办法
2019独角兽企业重金招聘Python工程师标准>>> 这两天做一个需要实时监控文本框输入的功能,碰到了中文输入法无法触发onkeyup事件的恶心问题. 具体表现是这样的: 当监听一 ...
h5页面笔按下默认是拖动,H5中在拖动的元素或选择的文本进入到有效的放置目标时触发的事件ondragenter...
实例在拖动的元素进入到放置目标时执行 JavaScript : 定义和用法 ondragenter 事件在拖动的元素或选择的文本进入到有效的放置目标时触发. ondragenter 和 ondrag ...

阻止中文输入时触发input事件

阻止中文输入时触发input事件相关推荐

最新文章

热门文章