禁用 pattern 验证的两种可靠方式是：一、将 pattern 值设为恒真正则（如 pattern=".*"，推荐）或空字符串（pattern=""，兼容性略低）；二、用 JavaScript 调用 input.removeAttribute('pattern') 动态移除属性。
禁用 pattern 验证的两种可靠方式
HTML5 的 pattern 属性默认会触发浏览器原生验证，只要输入不匹配正则就阻止表单提交，并显示提示。想让它“形同虚设”——即保留属性但不生效，核心思路只有两个：要么绕过验证逻辑，要么让正则永远为真。
- 在
<input>上添加novalidate属性只对整个<form>生效，不能单独关掉某个字段的pattern - 最直接有效的是把
pattern值设为恒真正则，例如pattern=".*"或pattern=""（空字符串在多数浏览器中也被视为无约束） - 另一个办法是用 JavaScript 移除该属性：
input.removeAttribute('pattern')，适合动态控制场景
pattern="" 和 pattern=".*" 有区别吗？
有，但对“禁用验证”这个目标来说效果一致。区别在于语义和兼容性：
-
pattern=""：HTML 规范未明确定义空字符串行为，Chrome/Firefox/Edge 均视其为无校验，但 Safari 16.4 之前曾短暂出现过异常提示，目前已稳定 -
pattern=".*"：明确匹配任意字符（包括空串），语义清晰、全浏览器兼容，推荐用于生产环境 - 注意：
pattern=".{0,}"等价于.*，但没必要写这么复杂；别用pattern="()"或pattern="^$"，前者无效，后者只匹配空串，反而限制了输入
为什么不能只靠 oninvalid + setCustomValidity('')？
这是常见误解。给元素绑定 oninvalid="this.setCustomValidity('')" 只是清空自定义错误信息，并不会跳过 pattern 的底层匹配检查——表单仍会因 checkValidity() 返回 false 而无法提交，除非你同时调用 reportValidity() 并拦截，或额外用 JS 手动覆盖验证逻辑。
- 仅设置
setCustomValidity('')后，input.checkValidity()依然返回false（如果内容不满足 pattern） - 真正想“绕过”，必须让浏览器认为 pattern 校验通过，而不是掩盖失败结果
- 所以，删属性或换恒真正则，比在事件里打补丁更干净、更可靠
服务端永远别信前端 pattern 是否被禁用
无论你用哪种方式让 pattern 不生效，它都只是影响浏览器 UI 层验证。用户完全可以禁用 JS、改 HTML、用 curl 绕过所有前端限制。
立即学习“前端免费学习笔记（深入）”；
-
pattern本质是用户体验增强，不是安全机制 - 即使你把它设成
.*，后端仍需按业务规则重新校验（比如手机号字段仍要检查是否为 11 位数字） - 特别注意：某些框架（如 Vue 的
v-model+ 表单绑定）可能自动注入 pattern 验证逻辑，此时需检查框架文档是否提供validate=false类似开关
