HTML的pattern属性仅在提交时校验，无法实时拦截空格；需结合oninput等事件手动清理，并处理光标、输入法兼容及后端全量清洗。
HTML 的 pattern 属性本身**完全无法防止空格输入**——它只在校验阶段（提交或调用 checkValidity()）判断值是否匹配，不拦截、不清理、不实时响应。空格照常能输、能粘贴、能出现在光标任意位置。
pattern="\S+" 为什么提交时才报错，却拦不住粘贴空格？
因为 pattern 是被动校验机制：用户粘贴 "abc def"，浏览器不会在粘贴瞬间删空格或阻止，而是等你点提交按钮时才用正则 \S+ 去匹配整个字符串——发现含空格，才报错。这期间 input.value 已经是脏数据。
-
pattern不监听任何输入事件，oninput、onpaste、onkeydown都和它无关 - 即使写了
pattern="\S+"，也不影响 DOM 值的更新逻辑 - 移动端长按粘贴、语音输入、自动填充等行为，
pattern全部无感
oninput="this.value = this.value.replace(/\s/g, '')" 光标乱跳怎么修？
直接赋值会重置光标到末尾，尤其在中间编辑时体验极差。必须手动保存并恢复 selectionStart 和 selectionEnd。
- 先读取当前光标位置：
const start = this.selectionStart; const end = this.selectionEnd; - 执行替换：
this.value = this.value.replace(/\s/g, ''); - 计算偏移量：被删掉的空格数在光标前会影响新位置，简单做法是
this.setSelectionRange(start, end)后再微调，但更稳的是用replace的回调记录删除位置 - 注意中文输入法组合状态：直接暴力 replace 可能打断输入法上屏，建议加
if (event.isComposing) return过滤
后端必须清洗全角空格和不可见字符
前端拦截只是体验优化，不是安全防线。用户禁用 JS、绕过表单、抓包重放，都能把 （全角空格）、\u200b（零宽空格）、\t、\r\n 送进来。
立即学习“前端免费学习笔记（深入）”；
- 服务端不能只 trim()，得用正则清除所有 Unicode 空白：
value.replaceAll(/\s/gu, '')或 Python 的re.sub(r'\s+', '', value) - 特别注意：
\s在 JS 中默认不匹配全角空格，需加u标志；Python 默认匹配，但需确认编码 - 数据库入库前做一次强制 normalize，比如 MySQL 的
TRIM(BOTH FROM value)+ 正则清洗
真正难的不是写那行 replace，而是处理光标、兼容输入法、覆盖所有粘贴路径，以及说服后端同事——别信前端传来的“已清理”字段。
