如何禁用keyCodes後允許標籤

Question

我有一個輸入字段，我只希望插入數字。

要做到這一點，我已經添加了以下屬性到輸入：

onkeypress="return event.charCode == 8 || event.charCode == 9 || event.charCode == 37 || event.charCode == 39 || event.charCode == 46 || event.charCode >= 48 && event.charCode <= 57" 

注：

   /* 
        keycodes allowed : 
        37 : left 
        39: right 
        46: decimal 
        48-57: digits + - 
        8: backSpace 
        9: tab 
       */ 

我有（只有在Firefox）的問題，就是沒有按TAB無法從一個領域轉換到另一個領域。

關於如何實現它的任何想法？

Answer 1

這裏是我的建議：

• 當檢測到非打印字符，你應該使用​​
• 你必須使用event.which和event.keyCode。 charCode已棄用。請參閱https://developer.mozilla.org/en-US/docs/Web/API/event.charCode
• 使用preventDefault可防止字符可靠打印。
• 不要在JavaScript中嵌入HTML屬性，很難重用和閱讀。

這裏的東西，你可以使用

document.getElementById('something').addEventListener('keydown', function(e) { 
 
    var keyCode = e.keyCode|| e.which; 
 
    var nonPrintableAllowed = [8,9,37,39,46]; 
 
    var isDigit = keyCode >= 48 && keyCode <= 57;       
 
    var isAllowed = nonPrintableAllowed.indexOf(keyCode) > -1 || isDigit; 
 
    console.log(isAllowed); 
 
    if (!isAllowed) { 
 
     e.preventDefault(); 
 
    } 
 
});

<input id="something" /><input /> <input />

Answer 2

處理鍵盤按鍵依然是棘手的，與瀏覽器，規格定義方法之間的不兼容問題的瀏覽器不支持，等等。在這種但是，解決方案似乎很簡單。如果您的代碼適用於其他相關的瀏覽器，則可以使用事件的key property來處理Firefox。它的值是製表符鍵的字符串Tab。

:focus { background: yellow } /* Just to show where the focus is */

<input onkeypress="console.log(event.key);return event.charCode == 8 
 
|| event.charCode == 9 || event.charCode == 37 || event.charCode == 39 
 
|| event.charCode == 46 || event.charCode >= 48 && event.charCode <= 57 
 
|| event.key == 'Tab'" > 
 
<input>