掃碼槍 移動端監聽

需求：

做一個使用掃碼槍掃描胸牌二維碼簽到的功能

掃碼槍有一個設置，可以追加一個掃描完成的特殊字符，前端根據固定的特殊字符來判斷是否掃描完成，從而執行后面的操作

步驟：

1. 掃描完二維碼以后，出現員工的標識id：sat-123
2. 掃碼槍設置之后，追加 zltd_send_enter_，得到sat-123zltd_send_enter_
3. 前端實時匹配zltd_send_enter_，確定掃描結束，進行操作

 

js:利用keyup方法，動態監聽實時輸入框內容，匹配掃描槍的結束標識字符

  $('#search-input').keyup(function () {
        var input=$(this)
        if($('#type').val()==1){
             //掃描查詢
            if($(this).val().indexOf('zltd_send_enter_')>0){
                var num=$(this).val().indexOf('zltd_send_enter_');
                $(this).val($(this).val().slice(0,num))
                if($(this).val().trim().length>0){
                input.attr('readonly',true)
                  操作
                }
            }
        }else{
            //防抖 姓名查詢
            clearTimeout(timer);
            timer = setTimeout(function() {
                SearchByName();
                $(".status-box").hide();
            }, 1000)
        }
    })

　　缺點：硬件依附性很高，在測試階段，由於掃描槍升級，導致結束標識符部分機器不出現，從而造成不能掃描的現象

 

解決：

由於之前，產品要求沒有觸發按鈕，所以通過監聽回車，keycode==13進行監聽

效果圖：

 

 

總結，以后掃碼槍問題，盡量在頁面設置按鈕，確保因為硬件而導致的問題出現