本文介绍如何可靠拦截印地语等 Unicode 非 ASCII 字符（如 Devanagari 脚本），解决 onkeypress 在移动端失效问题，推荐使用 input 事件结合正则校验与实时清理策略。
本文介绍如何可靠拦截印地语等 unicode 非 ascii 字符（如 devanagari 脚本），解决 `onkeypress` 在移动端失效问题，推荐使用 `input` 事件结合正则校验与实时清理策略。
在 Web 表单中限制用户仅输入英文字符（A–Z、a–z）和空格，看似简单，但实际在移动端（尤其是启用 Google Indic Keyboard、Gboard 印地语输入法等场景）常失效——根本原因在于 onkeypress 事件已被现代浏览器（包括 Chrome for Android、Safari iOS）弃用，且无法捕获虚拟键盘的组合输入或 IME（输入法编辑器）提交的完整字符。
✅ 正确做法：使用 input 事件 + 实时过滤
input 事件在所有设备上均可靠触发（包括粘贴、语音输入、IME 提交），能捕获最终插入的文本内容，是当前最健壮的解决方案：
<input type="text" name="username" id="username" placeholder="User Name*" maxlength="30" required oninput="filterNonAscii(event)" >
function filterNonAscii(event) {
const input = event.target;
// 允许：英文字母、空格、常见标点（可按需扩展）
const allowedPattern = /^[a-zA-Z\s]*$/;
// 检查当前值是否合规；若不合规，立即清理非法字符
if (!allowedPattern.test(input.value)) {
// 保留所有匹配允许模式的字符（即删除印地语、中文、符号等）
input.value = input.value.replace(/[^a-zA-Z\s]/g, '');
}
}⚠️ 注意事项：
- ❌ 不要依赖 onkeypress 或 onkeydown：它们在移动端对 IME 输入不可靠，且 event.key 在组合输入中可能为 Unidentified 或 Process；
- ✅ 使用 oninput 是关键：它在值变更后触发，覆盖粘贴、自动更正、语音输入等全部场景；
- ? 若需支持更多安全字符（如 -, ', .），请扩展正则表达式：/^[a-zA-Z\s\-\.\']*$/.test(value)；
- ? PDF 兼容性根源：多数 PDF 生成库（如 jsPDF、pdfmake）默认仅嵌入基础 Latin 字体，无法渲染 Devanagari（U+0900–U+097F）等 Unicode 区块，导致方块或空白——前端拦截是最轻量、最可控的预防手段；
- ? 补充验证：服务端仍需做二次校验（永远不要信任客户端过滤），避免绕过 JS 的恶意提交。
总结：面向生产环境的输入过滤，应放弃已废弃的 keypress，统一采用 input 事件 + 正则替换策略，并配合服务端兜底校验，才能真正保障跨设备一致性与 PDF 输出可靠性。
