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中嵌入JavaScript，很难重复使用和阅读。

这里有你可以使用的东西

＆＃13;

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();
    }
});

＆＃13;

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

＆＃13;

Answer 2

处理键盘键仍然很棘手，浏览器之间不兼容，规范定义浏览器不支持的方法等。但是，在这种情况下，解决方案似乎很简单。如果您的代码适用于其他相关浏览器，则可以使用事件的key property来处理Firefox。它的值是tab键的字符串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>

禁用keyCodes后如何允许选项卡

2 个答案: