jQuery阻止HTML文本框输入：Android Chrome退格键拦截失效求助

阿华AIGC实验室

2026-5-27

解决Android Chrome中无法拦截退格键的输入拦截方案

我太懂这个痛点了——移动端浏览器的键盘事件逻辑有时候和桌面端完全不一样，Android Chrome里的退格键就是个典型的“漏网之鱼”。你之前用keydown拦截常规输入没问题，但退格键在移动端可能绕过了这个事件的拦截，或者浏览器的默认行为优先级更高。

既然你不想用readonly（毕竟要保留动态允许输入的灵活性），这里有两个可靠的方案：

方案一：用`beforeinput`事件全面拦截（推荐）

HTML5的beforeinput事件会在任何输入/删除操作发生前触发，包括退格、删除键、粘贴、甚至语音/手写输入，覆盖范围比单纯的键盘事件广得多，在Android Chrome里兼容性也很好。

结合开关变量实现动态控制：

// 开关变量，默认禁止输入，需要时设为true即可
let allowInput = false;

// 保留原有的keydown拦截，处理常规按键
that.input.keydown(function(e) {
  if (!allowInput) {
    e.preventDefault();
    e.stopPropagation();
    e.stopImmediatePropagation();
    return false;
  }
});

// 新增beforeinput事件，拦截所有输入/删除操作（包括退格）
that.input.on('beforeinput', function(e) {
  if (!allowInput) {
    e.preventDefault();
    return false;
  }
});

// 示例：当需要允许输入时，执行这行代码
// allowInput = true;

这个方案不仅能搞定退格键，还能拦截其他可能的输入方式，比如用户长按粘贴的操作，比单纯监听键盘事件更全面。

方案二：针对性拦截退格键的keydown事件

如果你的场景只需要处理键盘输入，也可以在keydown事件里明确判断退格键的keyCode（8），强制阻止默认行为：

let allowInput = false;

that.input.keydown(function(e) {
  // 先拦截退格键
  if (!allowInput && (e.keyCode === 8 || e.which === 8)) {
    e.preventDefault();
    e.stopPropagation();
    return false;
  }
  // 再拦截其他所有按键
  if (!allowInput) {
    e.preventDefault();
    e.stopPropagation();
    e.stopImmediatePropagation();
    return false;
  }
});

不过这个方案的局限性在于，无法拦截非键盘触发的输入（比如粘贴、语音输入），所以更适合纯键盘操作的场景。