基于jQuery的掃碼槍監聽。如果只是想實現監聽獲取條碼掃碼信息，可以直接拿來使用，如果有更多的條碼判斷處理邏輯需要自己擴展。

一、功能需求

使用掃碼槍掃描條碼，在一個web頁面監聽獲取掃碼槍的數據，并禁止用戶進行手動的輸入操作。

開始的想法非常簡單，因為掃碼槍就是模擬鍵盤的輸入，當他用usb接口插入電腦的時候，就變成了一個外接的輸入設備，用js監聽就可以了。但是如何判斷用戶是否為手動輸入就需要做一些處理了。

二、主要問題

1.如何判斷是否手動輸入

2.如何判斷一個條碼輸入完成

三、解決方案

手動輸入的解決辦法就是：對比一個鍵從按下到抬起的時間間隔，以及兩次按鍵的時間間隔。

因為掃碼槍的輸入速度非常的快，我測試的掃碼槍輸入的間隔大概在15-60毫秒，然后手動輸入的100-200之間，除非刻意的想突破限制進行快速的輸入。這個間隔值可以控制的很小，前提不要快過掃碼搶的速度。

輸入完成的判斷：可以對輸入框變化做一個監聽，如果達到我們想要的位數，則提交服務器端進行處理；第二種是基于掃碼槍，因為我使用的掃碼槍可以配置掃碼成功最后附加一個回車。所以根據回車的keycode就可以判斷為輸入已經結束，然后獲取輸入框的value，再進行后續的處理（提交服務器等）。

四、代碼

時間間隔的判斷，依賴于jQuery的三個事件：keydown，keypress,keyup；即鍵開始按下，已經按下，彈起這三個狀態，keydown，就是在按鍵剛剛被按下，但鍵值還沒有寫入文本框，keypress已經按下并且值已經輸入到文本框，keyup就是彈起了。

需要做判斷的就是按鍵從按下到抬起的時間間隔，與兩次keydown的時間間隔。

主要的手動輸入判斷代碼。

var barcode = {  listenerObj: null,  oneKeyTime : '', /* 一次按鍵時間間隔 */  twoKeyTime : '', /* 兩次按鍵時間間隔 */  keyDownTime: '', /* 鍵按下的時間  */  barcodeLen : 8 , /* 條形碼長度   */  spanTime  : 70, /* 一次按鍵按下到釋放的時間間隔 */  on_key_down : function (){    var that = this;    this.listenerObj.keydown(function(e){      if(e.which !== 13 && !(that.in_range(e.which))){        $(that.listenerObj).val('');        return ;      }      var d = new Date();      var curTime = parseInt(d.getTime());      if(that.keyDownTime !== '' && that.keyDownTime !== NaN){        that.twoKeyTime = curTime - that.keyDownTime;      }      that.keyDownTime = curTime;    });  },  on_key_up : function(){    var that = this;    this.listenerObj.keyup(function(e){      var d = new Date();      var keyUpTime = d.getTime();      that.oneKeyTime = parseInt(keyUpTime) - parseInt(that.keyDownTime);      var isHand = that.checkHandInput();      if(isHand && that.in_range(e.which)){        layer.msg('禁止手動輸入');        $(that.listenerObj).val("");      }    })  },  on_key_press : function(){    var that = this;    this.listenerObj.keypress(function(e){      if(e.which == 13 && that.check_barcode()){        that.createListEl();      }    });  },  checkHandInput : function(){    if((this.oneKeyTime > this.spanTime) || this.twoKeyTime > this.spanTime){      return true;    }else{      return false;    }  },}