1)、首先我们得知道扫描枪的性质跟键盘是一样的,都是输入设备(可以等价理解为扫描枪就是键盘)。然后每次扫描完都会自动输入一个回车按钮。例如我们扫描一个条形码(中国商品的条形码上的数值都是13位的),相当于是我们在键盘上按了13下键盘按键。
2)、得知我们扫描枪的性质就是一个键盘,那我们就可以通过键盘的监听事件来监听扫描仪键入的按钮是哪一些(注意,监听到的数据是一个ASCII码,需要转换下)。
3)、上代码:(下面的代码监听的是全局的输入情况,不管你有没有获得输入框的焦点都可以监听的到,当然你也可以对一个输入框绑定该监听事件,稍微修改下代码即可)
<script>
var char = ""; //记录扫描枪输入的内容
var lastTime=null;//上次输入的时间
var nextTime=null;//这次输入的时间
var lastCode=null;//上次输入的键值(接收到的为ASCII值)
var nextCode=null;//这次输入的键值(接收到的为ASCII值)
$(document).keydown(function(event){
nextTime = new Date().getTime();//获取当前键入的时间
//判断是否输入了回车按钮,并确认是扫描枪键入的值
if (event.keyCode === 13 && char !== "" && nextTime - lastTime <= 30){
//把监听到的数据显示在我的文本框上
$("input[name='good_id']").val(char);
//清空数值,以便下一次扫描
char = "";
lastCode = null;
lastTime = null;
}else {
//获取键入的键值
nextCode = event.keyCode;
//如果是第一个字母你可以进行一些代码增强,我这里并没有处理,直接转换了
if(lastCode == null && lastTime == null){
//初始字母
char = String.fromCharCode(nextCode);
//写入你要增强的代码。。。
//判断是否是扫描枪键入的值
}else if(lastCode != null&&lastTime!= null && nextTime - lastTime <= 30){
//键入的值为ASCII码,要获取对应得值,需要转换一下
char += String.fromCharCode(nextCode);//存到char中,拼接上次的结果
} else{
//判断为手动输入,不做任何处理,数据保持为null即可
// alert("suck");
char = "";
lastTime=null;
nextTime=null;
lastCode=null;
nextCode=null;
}
//lastCode、lastTime为中间变量,存储数据,让nextCode与nextTime可以存新数据
//nextCode与nextTime要存储新键入按钮的信息
lastCode = nextCode;
lastTime = nextTime;
}
</script>
总之大体上就这个样子了,参考了这位老哥的文章https://www.jianshu.com/p/3019858e3cad
而且有一个问题我自己也不知道怎么解决,(我用的是AdminLTE的前端框架)那就是在input文本框获得焦点时扫描得到的是一堆乱码(估计跟我框架有关系),意思就是我在input文本框中键入一个字母a,跟没有获得焦点在全局的情况下键入一个字母a,它们通过代码监听到的ASCII码值是不一样的,这个问题我没解决,我也不知道怎么解决。我直接禁用input输入框了采用js代码为input框赋值,然后再加一个开关用于·开启 “手动输入”