扫码枪原理及案例

Posted 2020-12-13 mcsolo

使用场景：文本输入框获得焦点，扫码后自动显示

本质：扫码枪扫码相当于是模拟键盘输入，使用文本框keydown、keyup事件（当然不局限于文本框）

特点：扫码枪触发键盘事件时，最后一个键会是‘Enter‘，不同的硬件设备可能会不一样

冲突问题：怎样区分扫码时触发的键盘事件与正常的键盘事件？

1、手动键入时，keydown与keyup相隔时间差在80毫秒左右

2、扫码枪扫码键入时，keydown与keyup相隔时间很快，在10毫秒左右（当然，在所扫码相对复杂，然后扫码枪连续扫码，可能会出现某一个值的相隔时间会超过100毫秒）

 

实际案列：一个文本框展示扫码次数（type=“number”），即可手动输入，也可以扫码输入，同时需要在手动输入的基础上进行扫码累加 +1 （ 备注：扫码出来的内容与已知内容进行对比，一致则 +1 ）

1、首先正则出扫码内容的有效值（对手动输入和扫码均有效）

2、缓存键入的有效值

3、通过获取缓存键入值时的keydown和keyup时间差的平均值判断清除手动输入的数值

4、扫码内容匹配已知对比数据，相同则累加 +1