js获取外接扫码设备数据
相当于键盘输入设备,输入一连串数字后加一个enter键
html部分
<div style="display: none">
<!-- 隐藏的输入框 -->
<input
type="text"
id="scanInput"
name="scanInput"
placeholder="扫码枪数据"
style="width: 100%; height: 100%"
/>
</div>
js部分
autoFocus() {
console.log("获取焦点");
let that = this;
//设置隐藏的输入框获取默认焦点
let pFocus = document.getElementById("scanInput");
pFocus.focus();
let data = "";
let lastTime, nextTime;
let code
document.onkeydown = function (e) {
//这里没有用onkeypress,是因为onkeypress监听不到enter键,onkeydown 事件适用于所有键,但我这里的逻辑简单,onkeypress和onkeydown都可以,但如果判断的逻辑是那种加上lastCode,nextCode,根据下一个键入事件把上一次的写入data中就不能使用onkeypress,监听不到enter键,就会导致尾字丢失
// console.log(e)
code=e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;
nextTime = new Date().getTime();
if(nextTime && lastTime && nextTime-lastTime>100){//除开第一次,后续键入事件防止首字丢失,延迟输入,删除之前的数据重新计算
data=e.key
}else if(code!=13){
data+=e.key
}
lastTime = nextTime;
};
this.getScanData = function () {
document.onkeyup = function (e) {
// console.log(e)
let keyCode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;
if (keyCode == 13 && data != "") {
console.log("扫码枪数据:" + data);
//下方使用你要调用的方法
data=""//清空data值
}
};
};
this.getScanData();
},