pattern属性无法阻止中文输入，仅提交时校验；真正禁用需结合input事件过滤、inputmode控制及后端双重校验。
pattern 属性本身**不能防止输入中文**，它只在表单提交时校验，且对中文字符无拦截能力。想真正阻止中文输入，必须用 JavaScript 过滤或禁用输入法。
pattern="[u4e00-u9fa5]" 是反向操作，不是限制
写 pattern="[u4e00-u9fa5]+" 表示“只允许纯中文”，而不是“禁止中文”。用户照样能输英文、数字、符号，提交时才报错——而且错误提示不可控，移动端常不显示。
- pattern 不影响实时输入，粘贴、拖拽、语音输入全不受限
- 正则中
[u4e00-u9fa5]范围只覆盖常用汉字，漏掉生僻字、emoji、全角标点 - 浏览器对 Unicode 字符类支持不一：Safari 旧版本直接忽略
u4e00写法，需双反斜杠\u4e00才可能生效（但依然不拦截）
真正阻止中文输入得靠 input 事件 + replace
监听 input 事件（不是 keydown 或 onkeyup），用正则清除中文字符：
input.addEventListener('input', e => {
e.target.value = e.target.value.replace(/[u4e00-u9fa5]/g, '');
});
- 必须用
input事件：它捕获所有变更（粘贴、自动填充、输入法上屏） -
replace(/[u4e00-u9fa5]/g, '')比/[^ -]/g更准——后者会误删 emoji、日文假名、数学符号 - 注意中文输入法组合状态：直接赋值可能打断输入法，但简单场景下影响不大；若需更健壮，得配合
setSelectionRange和preventDefault
禁用中文输入法比过滤更彻底
用 inputmode="latin" 或 CSS ime-mode: disabled 主动关闭输入法：
-
<input type="text" inputmode="latin">：告诉浏览器“只预期拉丁字符”，iOS/Android 键盘会默认弹英文键盘（但无法阻止用户手动切换） -
<input style="ime-mode: disabled">：IE/旧版 Edge 支持，Chrome/Firefox 已废弃，仅作兼容补充 - 两者都**不防粘贴**——用户仍可复制中文后粘贴进来，所以仍需搭配
input事件过滤
textarea 不支持 pattern，必须全程 JS 控制
textarea 标签完全忽略 pattern 属性，哪怕写成 pattern="[^\u4e00-\u9fa5]*" 也无效。唯一可靠路径是：
- 监听
input和paste两个事件（paste需e.preventDefault()后手动读取 clipboardData 并过滤） - 避免只监听
keydown：它捕获不到右键粘贴、拖拽、语音输入 - 移动端尤其要注意：长按粘贴、手写输入、翻译输入等行为，都绕过键盘事件
最易被忽略的点：无论用哪种方式，后端都必须重新校验。前端过滤只是体验优化，用户关 JS 或抓包重放，中文照样能进数据库。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
