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>