交易平台网站模板,工程承包合作协议书,用asp.net做购物网站,西安公司注册流程1、业务场景 在文本框中输入内容#xff0c;执行查询接口#xff0c;但遇到一个问题#xff0c;当用拼音打字写汉字去搜索的时候#xff0c;会输入一些字母拼成汉字#xff0c;怎么能监听等拼音文字输入完成后再触发文本框监听事件 2、解决方案
通过查阅资料得知在输入中…1、业务场景 在文本框中输入内容执行查询接口但遇到一个问题当用拼音打字写汉字去搜索的时候会输入一些字母拼成汉字怎么能监听等拼音文字输入完成后再触发文本框监听事件 2、解决方案
通过查阅资料得知在输入中文包括语音识别时会先后触发compositionstart、compositionend事件类似于keydown和keyup的组合。
触发compositionstart时文本框会填入 “虚拟文本”待确认文本同时触发input事件在触发compositionend时就是填入实际内容后已确认文本。
先看看 compositionstart 的描述 和 compositionend 的 描述
compositionstart 事件触发于一段文字的输入之前类似于 keydown 事件但是该事件仅在若干可见字符的输入之前而这些可见字符的输入可能需要一连串的键盘操作、语音识别或者点击输入法的备选词。
compositionend 当文本段落的组织已经完成或取消时会触发该事件。
3、具体实现
divinput typetext classinput
/divscriptvar inpdocument.querySelector(input);let isCompositefalse;//控制search()触发function search(){//接口开始查询console.log(搜索);}inp.addEventListener(input,function(){if(!isComposite){settimeout((){search();});}})inp.addEventListener(compositionstart,function (){console.log(start);isCompositetrue;})inp.addEventListener(compositionend,function(){console.log(end);isCompositefalse;//由于等待拼音字母输入结束后文本框输入事件则不监听了//所以在结束拼写监听中放search()search();})/script