javascript - 如何防止在keydown上输入数字？

Question

我想防止在文本字段上的keydown 事件上输入数字并运行自定义处理程序函数。以下是问题

• e.target.value没用，因为键值尚未投影到目标值中
• e.keyCode数字取决于键盘类型、语言布局、Fn 或 Shift 键
• String.fromCharCode(e.keyCode)不可靠，至少在我的键盘上（Czech qwerty）
• w3 规范说e.keyCode是一个遗留属性并建议e.char，但它还没有在浏览器中实现

那么如何在数字输入出现在文本字段中之前捕获它呢？

Answer 1

请改用keypress事件。which它是唯一的关键事件，它将通过大多数浏览器中的属性和（令人困惑的）keyCodeIE 中的属性为您提供有关键入的字符的信息。使用它，您可以keypress根据键入的字符有条件地抑制事件。但是，这不会帮助您阻止用户粘贴或拖动包含数字字符的文本，因此您仍然需要某种额外的验证。

我最喜欢的 JavaScript 关键事件参考： http: //unixpapa.com/js/key.html

textBox.onkeypress = function(e) {
    e = e || window.event;
    var charCode = (typeof e.which == "undefined") ? e.keyCode : e.which;
    var charStr = String.fromCharCode(charCode);
    if (/\d/.test(charStr)) {
        return false;
    }
};

Answer 2

试试这个来替换整数值：

<input onkeydown="Check(this);" onkeyup="Check(this);"/>

<script>
function Check(me) {
    me.value = me.value.replace(/[0-9]/g, "");
}
</script>

防止整数输入：

<input onkeydown="Check(event);" onkeyup="Check(event);"/>

<script>
function Check(e) {
    var keyCode = (e.keyCode ? e.keyCode : e.which);
    if (keyCode > 47 && keyCode < 58) {
        e.preventDefault();
    }
}
</script>

Answer 3

我防止浮动代码字符的解决方案

    // 'left arrow', 'up arrow', 'right arrow', 'down arrow',
    const = arrowsKeyCodes: [37, 38, 39, 40],
    // 'numpad 0', 'numpad 1',  'numpad 2', 'numpad 3', 'numpad 4', 'numpad 5', 'numpad 6', 'numpad 7', 'numpad 8', 'numpad 9'
    const = numPadNumberKeyCodes: [96, 97, 98, 99, 100, 101, 102, 103, 104, 105],

    export const preventFloatingPointNumber = e => {
    // allow only [0-9] number, numpad number, arrow,  BackSpace, Tab
    if ((e.keyCode < 48 && !arrowsKeyCodes.includes(e.keyCode) || e.keyCode > 57 &&
        !numPadNumberKeyCodes.includes(e.keyCode)) &&
        !(e.keyCode === 8 || e.keyCode === 9))
        e.preventDefault()
    }