讲解在同名B/D上都有,主要介绍一些跟业务无关的代码技巧
注: 部分内容主观性较大,一家之言姑且听之
本文主要介绍群友的奇葩问题,如何处理input时,不需要中文的问题
需求
输入中文时,输入框中不要拼音
输入框中有拼音
一般会像下图这样,他有拼音提示,注意,这是两种输入法,架不住老板要求,就是不允许在input里有提示词,要跟微信的效果保持一致
要取消拼音
微信的效果图,比如第一款输入框就有这种效果
但还有这种输入法啊,老板选择性失明,反正就要取消拼音
原理
浏览器
先说浏览器,对于浏览器而言,渲染input最终是HTMLInputElement,里面有核心函数setValue,setValue里只有value,并不会对value的内容拆解,换句话说,只要我们能看到input里的内容,那这个值一定存在value里,没有其他事件可以拦截
比如我们使用如下操作，他可以保证我们在baidu中,1s获取一次输入框的内容,我们收到的内容,就是我们看到的拼音
setInterval(()=>console.log(document.getElementById("kw").value),1000)
输入法
在开几个拼音的开源作品
pinyin缓存系列
我知道他有错别字,但源码就是这样,不改了,注意它包含了拼音缓存和汉字缓存,在触发事件时,比如回车,会把汉字第一个数据进行提交,如果是回车,会将拼音缓存进行提交
这种是没有拼音提示的模型的,拼音提示可以由输入法自己做,比如某个版本的搜狗,就可以做到上面的效果
标准模型
输入法中,对于该事件的交互分三个阶段,两个事件,一个为preedit,一个为commit
预编辑就是我们看见的拼音提示词部分
提交就是替换预编辑内容,转换为中文的阶段
正常看见的就是这个效果,有兴趣可以自行查询对应的文档
总结
这种垃圾细节没屁用,反正我是不会实现的,让我想起现在的古装剧,也就是吃和擦边上花点心思,力求还原细节,其他细节真实一眼难进
