javascript - 如何在禁用键码后允许选项卡

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

以下是我的建议:

• 检测不可打印字符时，应使用 keydown
• 您必须使用 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 />