html页面使用js读取扫码枪的扫码内容

 USB扫码枪相当于键盘输入,假设二维码里面保存的内容是 AbCdeEg,那么USB扫码枪在扫码时就相当于快速的依次按下了AbCdeEg这几个键,
 所以我们在js里面只要监听键盘时间就可以获取到扫码的内容。

我这里监听的是keypress事件,他可以区分大小写,使用keyedown事件好像不行。

有的扫码枪需要设置为自动在扫码结束后添加一个回车键的功能。


<script> $(function () { var chars = '';//暂存字符串 var timeOut = 1000;//超时时间 var lastDate = new Date(); var isFirst = true; //var running = false; $(window).on("keypress", function (e) {//keypress可以区分输入的大小写,keydown不行 var code = e.which || e.keyCode; //本次时间与上次时间之差大于xxms 则强制上次扫码结束,本次作为第一个字符 if (new Date() - lastDate > timeOut) { isFirst = true; } //if (!running) { return; } //如果是第一个字符,则将之前的字符串置空 if (isFirst) { chars = ''; console.log('扫码中'); isFirst = false; } lastDate = new Date(); //如果捕获到回车键,则扫码结束,将保存的字符串解析并展示到页面上 if (code == 13) { console.log('扫码结束'); isFirst = true; if (chars != '') { console.log(chars); $("#erCodeTxt").text(chars); try { //我扫的二维码保存的内容是一串base64 var jsonStr = $.base64.atob(chars, true, 'utf8') console.log(jsonStr); var item = JSON.parse(jsonStr); if (item) { $("#oper").val(item.oper); $("#partCode").val(item.partCode); $("#model").val(item.model); $("#partName").val(item.partName); $("#opDate").val(item.opDate); $("#cInvIns").val(item.cInvIns); $("#cInvCode").val(item.cInvCode); // $("#btnSubmit").html('<i class="layui-icon layui-icon-pencil" style="font-size: 14px; "></i> 入库') } } catch (e) { layui.use('layer', function () { var layer = layui.layer; layer.msg("当前不支持此二维码格式"); }); } } else { layui.use('layer', function () { var layer = layui.layer; layer.msg("未能获取到二维码信息"); }); } } else { //如果不是回车键,则将此次捕获到字符追加到暂存字符串中 chars += String.fromCharCode(code); console.log(chars); } }) }) </script>

 

上一篇:全球及中国消费后再生树脂行业供需态势及前景规划分析报告(2022-2027)


下一篇:一些我曾经遇到但没解决,等待大虾来解决的tricky problems