novalidate 是 form 元素的布尔属性，仅作用于整个表单，不支持局部禁用验证；需通过 setcustomvalidity('')、removeattribute('required') 或 disabled/readonly 等方式实现字段级控制。
novalidate 是表单级属性，无法局部开启
novalidate 是 <form></form> 标签的布尔属性，作用范围是整个表单——它关闭的是浏览器原生的 required、type="email" 等验证逻辑，**不支持只对某个 <input> 或某组字段生效**。试图写成 <input novalidate> 或在 JS 中给单个元素加该属性，完全无效。
想绕过某几个字段的验证？用 JavaScript 手动干预
浏览器没提供“局部禁用验证”的 HTML 机制，但可通过 JS 拦截验证触发点来实现等效效果：
- 监听
submit事件，在event.preventDefault()后手动校验其他字段，跳过你想忽略的字段（比如document.getElementById('skip-field').value = ''不报错） - 对目标字段调用
setCustomValidity('')，清除其内置验证错误；若需临时禁用，可设为空字符串，提交前再恢复（setCustomValidity('Please fill this')） - 提交前临时移除
required、pattern等属性：input.removeAttribute('required')，提交后再加回（注意 DOM 状态同步）
为什么不用 novalidate + 自定义验证？容易踩的坑
直接给 <form novalidate></form> 再自己写全量验证，看似一劳永逸，但实际容易漏掉细节：
- 失去浏览器原生的 UI 提示（如红色边框、焦点滚动、气泡提示），需自行实现，体验割裂
- 移动端键盘类型（
inputmode="numeric"）、自动聚焦等行为依赖原生验证逻辑，novalidate后可能失效 - 无障碍支持（ARIA）需额外补全，否则屏幕阅读器无法正确播报验证状态
- 如果只绕过 1–2 个字段，全表单关验证反而增加维护成本
更稳妥的替代方案：用 disabled 或 readonly 配合逻辑判断
某些场景下，“不验证”本质是“不该由用户填”或“由后端决定”，这时比 JS 干预更干净：
- 字段本就不该被编辑（如 ID、token）：用
disabled，它天然不参与submit数据，也不触发验证 - 字段允许显示但不可改（如预填邮箱）：用
readonly+required，浏览器不会校验readonly字段是否为空 - 后端才决定是否必填：去掉前端
required，把校验逻辑下沉到接口层，前端只做格式提示（如 placeholder 或 help text）
真正需要“局部跳过验证”的时候，setCustomValidity('') 是最轻量、兼容性最好、且不影响其他字段原生行为的做法。别碰 novalidate 的边界，它本来就没设计成局部开关。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
