min/max 对 type="number" 仅提交时校验，属软约束；需配合 valueasnumber、step="1"、后端二次验证等措施确保数值合规。
min/max 对 type="number" 有效，但只在提交时校验
浏览器不会实时阻止用户输入超限数字——比如 min="18" 时，用户仍能键入 17 或粘贴 -5，直到失焦或点击提交才触发提示。这不是 bug，是 HTML 规范定义的“软约束”行为。
常见错误现象：表单提交成功，但后端收到 age=12；或者用户删空输入框后提交，value 是空字符串，范围校验直接跳过。
-
min和max的值必须是字符串（如min="18"），不能是数字类型（min=18在 React 等框架中会被丢弃） - 未设
required时，空值合法，不触发范围检查 - 默认
step="any"，可能导致小数输入绕过整数限制（例如max="10"却能输10.999），需显式写step="1"
type="number" 的 value 是字符串，比较前必须转数字
直接用 input.value > input.max 会出错："100" 返回 <code>true（字符串字典序比较）。必须解析成数值再比。
推荐用 input.valueAsNumber——它返回数字类型，非法时为 NaN，比 parseFloat() 更可靠（例如输入 "3.14e2" 也能正确解析）。
- 赋值时优先用
input.valueAsNumber = 18，它会同步更新value和内部状态；不要只改input.value = "18" - 监听
input事件做实时截断，而不是等change：用户边输边修正，体验更顺滑 - 示例逻辑：
input.addEventListener('input', () => { const val = input.valueAsNumber; if (!isNaN(val)) { if (val parseFloat(input.max)) input.valueAsNumber = parseFloat(input.max); } });
date 类型的 min/max 必须是 YYYY-MM-DD 格式，且补零不能省
min="2024-1-1" 或 min="2024/01/01" 全部无效——浏览器静默忽略，控件照常显示所有日期。只有严格匹配 YYYY-MM-DD 才生效。
Safari 直到 v17+ 才支持日历禁用，旧版仅在提交时校验；安卓部分浏览器对 min/max 响应不稳定，建议实测主流机型。
- 动态生成日期字符串时，必须手动补零：
`${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}` - 避免用
new Date().toISOString().split('T')[0]：东八区调用可能因 UTC 转换导致日期偏差一天 -
type="date"的比较是字符串字典序，不是时间戳——所以min="2024-01-01"能拦住"2023-12-31"，但拦不住"2024-01-01a"（非法格式仍可提交）
服务端永远要二次校验，前端限制只是体验层
用户开开发者工具删掉 min 属性、禁用 JS、或绕过表单直接发 POST 请求，都能把任意值送到后端。前端限制本质是降低误操作率，不是安全边界。
容易被忽略的点：业务强依赖数值范围时（如年龄 ≥18、金额 ≤10000），仅靠前端会埋下逻辑漏洞。比如注册页设了 min="18"，但后端没校验，就可能出现 16 岁用户完成全流程。
- 后端必须独立解析并验证原始请求参数，不信任任何前端传来的
min/max值 - 若涉及风控或合规（如金融、实名认证），建议结合身份证号解析或第三方接口确认真实值
- 错误提示要明确：不要只回 “参数错误”，而应返回具体范围要求，例如
{"error": "age must be between 18 and 120"}
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
