必须添加 novalidate 属性到 form 标签才能启用 bootstrap 验证样式，否则仅触发浏览器默认弹窗；需配合 needs-validation 类和 submit 事件中调用 checkvalidity() 并手动添加 was-validated 类。
必须加 novalidate 才能启用 Bootstrap 样式
不加这个属性，required、minlength 这些 HTML5 属性只会触发浏览器默认弹窗，Bootstrap 的红色边框和 .invalid-feedback 完全不会出现。它不是可选项，是开关——写在 <form></form> 标签上，不能写在某个 <input> 里。
-
novalidate只禁用原生弹窗，不影响 JS 读取validity状态或调用checkValidity() - 漏掉它最常见现象：提交后没任何视觉反馈，控制台也无报错，纯静默失败
- 如果用了
.needs-validation类但没配novalidate，那个类就等于白加
needs-validation 和 was-validated 到底该用哪个
needs-validation 是“准备就绪”状态，告诉 Bootstrap：“等用户提交时再开始校验并显示样式”；was-validated 是“已校验过”状态，表示“现在就该根据当前值显示有效/无效样式”。页面一加载就加 was-validated，所有 required 字段立刻红框报错，体验极差。
- 日常开发推荐
needs-validation+novalidate组合 - 必须在
submit事件里手动调用form.checkValidity()，失败时加was-validated - 加了
was-validated后，:valid/:invalid伪类才真正参与样式计算
验证样式只作用于控件本身，不是外层容器
Bootstrap 5 的 .is-invalid、.is-valid 类必须加在 <input>、<select></select> 或 <textarea></textarea> 上，加在包裹它的 <div> 或 <code><label></label> 上完全无效——边框颜色不变，.invalid-feedback 也不会显示。
- 自定义规则（如密码强度）必须配合
setCustomValidity()+ 手动切换is-invalid类 -
.invalid-feedback元素必须紧邻控件之后，中间不能有空格、换行或其它标签 - iOS Safari 对伪类响应延迟，仅靠
:invalid不可靠，必须用 JS 主动设类
minlength 等原生属性生效有明确限制
minlength 只对 type="text"、"email"、"password"、"search"、"tel"、"url" 和 <textarea></textarea> 生效，对 type="number" 或 "date" 无效。而且它不会单独触发——如果字段为空，valueMissing 错误会优先于 tooShort 被报告。
- 必须和
required配合，或确保字段非空，否则看不到minlength的提示 - 屏幕阅读器能正确播报
minlength提示，是无障碍友好方案 - 不用改 JS 逻辑：
form.checkValidity()自动识别minlength，无需额外判断
novalidate 开启权限、needs-validation 设定时机、was-validated 触发渲染、原生属性提供规则、JS 补足状态同步——少一环，视觉反馈就断掉。
