input 中文输入法额外触发change事件问题

用ant mobile input 组件实现下面输入提示，提示添加click事件，input 添加change事件。

预期：点击提示项的时候，预期是只触发click事件。

实际：英文输入法正常，只触发click事件；中文输入法触发了click事件，同时触发了input的change事件。

现象：下面页面还用了LoadMoreList，并在 loadMore加载更多数据，导致点击后提示仍在，同时循环请求接口获取数据。

解决方案

1、在每次点击提示的时候记录点击事件 clicktime

2、change事件里获取 time = nowTime - clicktime

3、通过time > 500 过滤掉这种额外触发change事件的情况，不做处理。

同事推了这篇文章，发现原来input还有compositionend事件，不过看起来应该不能解决这个问题，所以还是采用时间去过滤。

input 中文输入法额外触发change事件问题相关推荐

中文输入法不触发onkeyup事件的解决办法
2019独角兽企业重金招聘Python工程师标准>>> 这两天做一个需要实时监控文本框输入的功能,碰到了中文输入法无法触发onkeyup事件的恶心问题. 具体表现是这样的: 当监听一 ...
iframe页面改动parent页面的隐藏input部件value值，不能触发change事件。
实现一个依据iframe页面返回充值卡类型不同,安排不同的input部件. 点击选择弹出一个iframe.点击充值卡数据行.返回1.充值卡类型.2.充值卡id(用的UUID).3.充值卡号(字符串). ...
vue input 中文输入法回车
vue input 中文输入法回车 <input type="text" class="tc-15-input-text" placeholder=&qu ...
解决上传文件或图片时选择相同文件无法触发change事件的问题
昨天在做一个上传文件的模块时遇到了这样的问题:打开文件一上传,上传成功后再次点击文件一,change事件无反应 <input type="file" name="f ...
js 触发 change 事件
首先,请各位包涵,我本人对 JS 不是很熟,不知道"触发change事件"和"触发onchange事件"哪个更加合适.有园友知道的麻烦指出,先行谢过. 起因是这 ...
change()事件及val()/html()方法不会触发change事件
change()事件及val()/html()方法不会触发change事件一.定义 change()函数用于为每个匹配元素的change事件绑定处理函数当元素的值发生改变时,会发生 change ...
VUE扫码枪中文输入法兼容自动回车事件(上)
背景最近产品想要在页面上加一个input输入框,想要手动输入,也想要扫码枪扫描输入,大家都知道扫码枪扫描后会自动出发input的回车enter事件的,我当初也是这么认为的,所以在input上就直接绑 ...
js my97 WdatePicker 联动触发change事件
1,效果图 2,功能说明当我选择了药物起始时间和停止使用时间之后,时间分层会自动计算两个字段的时间差并填入数值,即选即算功能基本实现,就是无法做到即选即算,当我选择了两个字段的时间之后, ...
JQ JS 改变value值不触发change事件
JQ改变value值不触发change事件 Change事件触发有两个必要条件:值改变.失去焦点.所以当使用JQ改变值时,控件没有失去焦点,所以不会触发. 目前验证有效的解决办法,只能是手动触发cha ...

input 中文输入法额外触发change事件问题

input 中文输入法额外触发change事件问题相关推荐

最新文章

热门文章