本文系统讲解 keydown/keyup/keypress 三类键盘事件的核心差异、现代推荐用法，重点解析为何直接监听 AltRight 或 keyCode 无法阻止 AltGr 输入的重音字符（如 ē、ṭ），并提供基于 input 事件 + 正则过滤的可靠解决方案。
本文系统讲解 `keydown`/`keyup`/`keypress` 三类键盘事件的核心差异、现代推荐用法，重点解析为何直接监听 `altright` 或 keycode 无法阻止 altgr 输入的重音字符（如 ē、ṭ），并提供基于 `input` 事件 + 正则过滤的可靠解决方案。
在 Web 开发中，处理键盘输入常需兼顾功能性和安全性。许多开发者尝试通过 keydown 事件拦截 AltGr（Alternate Graphic）组合键——例如在欧洲键盘上按 AltGr + e 输入 ē，或 AltGr + t 输入 ṭ——以限制文本区域仅接受 ASCII 字符。但常见误区是：仅靠 event.code === 'AltRight' 或检测 keyCode（如 17/18）根本无法阻止这些字符的输入。原因在于：
-
AltGr在多数系统中被映射为Ctrl + Alt的组合，其本身不触发独立的“按键字符”，而是在底层合成 Unicode 字符后，才通过input事件提交到<textarea></textarea>； -
keydown和keyup事件捕获的是物理按键动作，而非最终输入的字符；keypress已被废弃，且在现代浏览器中行为不一致； - 即使调用
event.preventDefault()在keydown中，也无法阻止由操作系统级输入法（IME）或键盘布局生成的复合字符插入。
✅ 正确解法：放弃在 keydown/keyup 中拦截，转向 input 事件 + 实时内容净化
input 事件在用户输入（包括键盘、粘贴、拖放、语音输入等）完成后立即触发，此时 event.target.value 已包含最新文本，是最可靠的内容校验时机。
以下为轻量、跨框架通用的实现方案（无需 Angular 也可直接用于原生 JS）：
<textarea id="cleanInput" placeholder="仅允许 ASCII 字符（0x00–0x7F）"></textarea>
const textarea = document.getElementById('cleanInput');
// ✅ 推荐：使用 input 事件 + Unicode 范围正则过滤
textarea.addEventListener('input', function (e) {
// 匹配所有 ASCII 字符（U+0000 至 U+007F），排除所有扩展 Unicode 字符（含重音、符号、中文等）
const asciiOnly = e.target.value.match(/[\x00-\x7F]*/g)?.join('') || '';
if (asciiOnly !== e.target.value) {
e.target.value = asciiOnly;
// 可选：恢复光标位置（避免跳位）
e.target.setSelectionRange(asciiOnly.length, asciiOnly.length);
}
});
? 关键说明：
用于 inference.sh 的 JavaScript/TypeScript SDK，可运行 AI 应用、构建代理、集成 150+ 模型。包名：@inferencesh/sdk（npm install），完整 TypeScript 支持。
- 正则
/[\x00-\x7F]*/g精确匹配标准 ASCII 字符集（共 128 个字符），天然过滤ē（U+0113）、ṭ（U+1E6D）等所有非 ASCII 字符； - 使用
match(...)?.join('')避免null异常，确保空值安全； - 若需保留换行符、制表符等控制字符，可微调正则为
/[\x00-\x09\x0B\x0C\x0E-\x7F]*/g（排除\r\n\t外的控制符）； - 对于粘贴场景，该方案同样生效——因为
paste会触发input事件（注意：paste事件本身不可取消，但input是最终落点）。
⚠️ 为什么不推荐 keydown.preventDefault()？
-
AltGr + e在keydown阶段仅触发AltLeft和KeyE两个独立事件，无AltGr事件对象； -
event.code在 Chrome/Firefox 中对 AltGr 键可能返回'AltLeft'或'AltRight'，但不表示当前正在输入重音字符； -
event.key在keydown中仍为'e'，直到input阶段才变为'ē'； - 过度阻止
keydown可能破坏可访问性（如屏幕阅读器快捷键）和原生编辑行为（如光标移动、删除）。
? 进阶建议（生产环境）：
- 结合
beforeinput事件（实验性但更早介入），但需降级至input； - 对
<input type="text">同样适用； - 如需支持国际化白名单（如允许中文但禁用 emoji），可改用 Unicode 属性正则，例如
/[\p{Script=Han}\p{Script=Latin}]/gu（需启用u标志）； - 始终搭配后端校验——前端过滤仅为用户体验优化，不可替代服务端安全验证。
掌握键盘事件的语义边界（按键动作 vs. 字符输入），是写出健壮表单逻辑的关键。记住：要控制“输入什么”，请监听 input；要响应“按下哪个键”，才用 keydown/keyup。
Java免费学习笔记：立即使用
解锁 Java 大师之旅：从入门到精通的终极指南
