使用jQuery检测/阻止输入框中Alt+小键盘输入的Unicode字符

这个问题我之前也碰到过！Alt+小键盘输入Unicode属于系统级的字符插入，keyup事件确实不太好使——等keyup触发的时候，字符已经乖乖躺在输入框里了，而且这时候Alt键大概率已经松开，你根本没法判断刚才是不是Alt组合操作。

给你两个关键思路解决这个问题：

1. 在字符插入前拦截：用keydown事件
   keydown是在字符被输入到框里之前触发的，这时候我们能直接阻止Alt+小键盘的默认行为。同时还能顺便限制普通的非数字输入。

2. 兜底过滤：用input事件
   总有一些特殊情况（比如系统强制插入、某些奇怪的粘贴场景）可能绕过keydown，这时候input事件能实时检查输入框内容，把非数字字符干掉，还能保持光标位置不跳，用户体验更好。

直接上完整代码：

$("#myInput").on('keydown', function(event) {
    // 拦截Alt+小键盘数字的组合（小键盘数字keyCode是96-105）
    if (event.altKey && (event.keyCode >= 96 && event.keyCode <= 105)) {
        event.preventDefault();
        return false;
    }
    // 允许数字键（普通+小键盘）和必要的控制键（退格、方向键等）
    const allowedKeys = [8, 9, 13, 37, 38, 39, 40, 46, 48, 49, 50, 51, 52, 53, 54, 55, 56, 57, 96, 97, 98, 99, 100, 101, 102, 103, 104, 105];
    if (!allowedKeys.includes(event.keyCode) && !event.ctrlKey && !event.metaKey) {
        event.preventDefault();
        return false;
    }
}).on('input', function() {
    const $input = $(this);
    const oldValue = $input.val();
    // 过滤所有非数字字符
    const newValue = oldValue.replace(/[^0-9]/g, '');
    
    if (oldValue !== newValue) {
        // 记录光标位置，避免更新后光标跳到末尾
        const cursorPosition = $input[0].selectionStart;
        $input.val(newValue);
        // 调整光标：减去被删除的字符数
        $input[0].selectionStart = $input[0].selectionEnd = cursorPosition - (oldValue.length - newValue.length);
    }
});

代码解释： #

• keydown部分：先检查是不是Alt+小键盘数字，是的话直接阻止默认行为，不让系统插入Unicode字符。同时只允许数字和常用控制键，避免用户输入其他字符。
• input部分：作为最后一道防线，不管用户用什么方式（粘贴、系统插入等）输入了非数字，都能立刻过滤掉。而且处理了光标位置，用户输入到一半的时候不会突然跳光标，体验更流畅。

之前你用keyup的问题在于，等事件触发时字符已经输入完成了，这时候再删除会有明显的闪烁，而且Alt键的状态已经无法捕捉，根本没法判断是不是Alt组合操作。换成keydown+input的组合就能完美解决这个问题啦！

内容的提问来源于stack exchange，提问作者coderatchet