只輸入數字的輸入鍵碼驗證器也接受正斜槓

Question

我寫了一段只接受數值作爲關鍵事件的碼。它應該只接受0-9和退格。但它也允許正斜槓作爲輸入。

element.addEventListener('keypress',function(event){ 
      var charcodeAcceptable=[47,48,49,50,51,52,53,54,55,56,57,8]; 
      if (window.event) { 
       var charCode = window.event.keyCode; 
      } 
      else if (event) { 
       var charCode = event.which; 
      } 


      if(charcodeAcceptable.indexOf(charCode)==-1){ 
      event.preventDefault(); 

      } 
     }); 

Answer 1

爲正斜槓/ ASCII碼爲47，所以你indexOf返回0，而不是-1。

Answer 2

在我引用下面的原始答覆後，根據@ t.niese留下的評論，我創建了一個更新的筆。

http://codepen.io/ballerton/pen/PzOdxW

Essentialy，使用event.key拿到按鍵的值，然後測試與允許值：

element.addEventListener('keypress',function(event){ 
    var charcodeAcceptable=['1','2','3','4','5','6','7','8','9','0','Backspace']; 
    if (window.event) { 
     var charCode = window.event.key; 
    } 
    else if (event) { 
     var charCode = event.key; 
    } 


    if(charcodeAcceptable.indexOf(charCode)==-1){ 
    event.preventDefault(); 

    } 
}); 

我已經修改爲使用event.keyCode的代碼和它的工作原理預計爲 。

http://codepen.io/ballerton/pen/vKWzRO

element.addEventListener('keypress',function(event){ 
     var charcodeAcceptable=[47,48,49,50,51,52,53,54,55,56,57,8]; 
     if (window.event) { 
      var charCode = window.event.keyCode; 
     } 
     else if (event) { 
      var charCode = event.keyCode; 
     } 


     if(charcodeAcceptable.indexOf(charCode)==-1){ 
     event.preventDefault(); 

     } 
    }); 

原筆由@ t.niese

克里斯Coyier

見註釋對於測試本身，是不是看到重要的t檢驗，如果它是 一個窗口事件？

如果不是你能不能只使用：

element.addEventListener('keypress',function(event){ 
    var charcodeAcceptable=[47,48,49,50,51,52,53,54,55,56,57,8]; 

    if(charcodeAcceptable.indexOf(event.keyCode)==-1){ 
     event.preventDefault(); 
    } 
    });