minlength需配合type和required才生效，否则不触发验证；对type="number"无效；原生校验仅提交时执行且不支持动态规则，JS可实时校验并调用setCustomValidity()增强提示。
minlength 属性不能单独触发浏览器原生验证，必须配合 type="text"（或 type="email"、type="search" 等）和 required 才生效。
为什么填了 3 个字符还报“请填写最少 X 个字符”？
常见错误是只写了 minlength="5" 却没加 required。浏览器只在表单提交时对带 required 的字段做 minlength 校验；如果字段可选，即使内容少于最小值，也不会报错。
- ✅ 正确写法：
<input type="text" minlength="5" required> - ❌ 无效写法：
<input type="text" minlength="5">（用户留空或输 2 字都不拦） - ⚠️ 注意：
minlength对type="number"无效——它只认字符串长度，数字输入框实际传的是数值，浏览器会忽略该属性
和 JavaScript 的 input.length 验证有啥区别？
原生 minlength 是声明式、UI 友好、无需手写逻辑；但它的校验时机固定（仅提交时），且不支持动态变化。而 JS 可实时监听、结合正则、允许条件性启用。
- 原生方案适合静态规则，比如“用户名至少 4 位”
- JS 方案适合复杂场景，例如“密码最少 8 位，且含大小写字母+数字”
- 若用 JS 手动校验，别忘了调用
setCustomValidity()和reportValidity()，否则不会触发红边/气泡提示
Vue/React 里直接绑定 minlength 为啥没反应？
框架中如果用了 v-model 或 value + onChange 控制组件，原生表单属性可能被绕过——尤其是自定义组件封装了 <input> 却没透传 minlength 和 required。
- Vue：确保在模板中显式写出
:minlength="5"和required，而非只靠 data 绑定 - React：用
minLength（驼峰），不是minlength（小写会失效） - Next.js / Remix 等服务端渲染环境，注意 hydration 后属性是否仍存在——某些 SSR 框架会过滤未知 HTML 属性
真正容易被忽略的点：移动端 Safari 对 minlength 支持较晚（iOS 10.3+），旧版本会静默忽略；如果目标用户含 iOS 9 用户，必须补 JS 回退逻辑。
