HTML5中min和max属性仅对number、range、date、datetime-local、month、week、time类型生效，需严格匹配格式且必须服务端校验。
min 和 max 属性在 HTML 表单中确实有效，但只对特定 type 生效，且必须满足格式、类型、时机三重约束——不按规范写，浏览器就当没看见。
哪些 input type 支持 min/max
仅以下 type 原生支持：number、range、date、datetime-local、month、week、time。其他如 text、email、tel 加了也无效。
-
number：值必须是数字字符串（如"10"、"3.14"），不能是"10.00"（部分旧版 Chrome 会忽略小数位） -
date：值必须是严格YYYY-MM-DD格式（如"2024-03-01"），"2024-3-1"、"2024/03/01"、"2024-03-01T00:00"全部静默失效 -
datetime-local：需用YYYY-MM-DDTHH:MM（无时区，无秒），例如"2024-03-01T14:30" - 不支持
color、file、checkbox等任何非数值/时间语义的 type
动态设置 min/max 容易踩的坑
用 JS 动态赋值时，input.min = "2024-03-01" 看似可行，但实际行为不稳定——某些浏览器（尤其是 Safari）要求必须用 setAttribute() 才能触发 UI 更新。
- ✅ 正确做法：
input.setAttribute('min', '2024-03-01')或input.setAttribute('max', '2024-12-31') - ❌ 错误写法：
input.min = new Date()（转成字符串后格式非法）、input.min = 20240301（数字类型，浏览器尝试 toString() 后得"20240301"，不是合法日期） - ⚠️ 注意空值：
input.setAttribute('min', '')或input.min = ''会清空限制，等同于未设置；null或undefined也会被忽略 - ? 服务端返回带时区的日期（如
"2024-03-01T08:00:00+08:00"）需先截取：new Date().toISOString().split('T')[0]
为什么用户还能输进非法值？
因为 min/max 只控制日历控件选择范围和表单提交校验，**完全不限制键盘输入或粘贴**。这是浏览器标准行为，不是 bug。
- 用户可手动输入
"2025-01-01"到一个max="2024-12-31"的date输入框里，且不会实时报错 - 监听
input事件做即时校验时，注意input.valueAsNumber在非法日期下返回NaN，比new Date(input.value)更安全（后者跨时区可能偏移一天） - Safari 某些版本对
change事件触发不一致，建议加blur回退校验 - 真正兜底方式是结合
setCustomValidity()：if (input.value > input.max) input.setCustomValidity('不能晚于' + input.max)
服务端永远不能信任前端的 min/max
用户禁用 JS、改 DOM、用 curl 直接 POST，都能绕过所有前端限制。MySQL 中的 MIN() 和 MAX() 是服务端聚合函数，和 HTML 的 min/max 属性毫无关系，别混淆。
- 后端收到
date字段一定是字符串（如"2025-13-01"），必须按YYYY-MM-DD校验格式 + 范围，不能直接转Date对象依赖其构造逻辑 - 数值字段收到
"abc"或超限值很常见，需做类型转换 + 边界判断，不能只信type="number" - 最常被忽略的一点：前端设了
min="1" max="100"，但用户提交的是value="50.5"，而数据库字段是INT—— 类型不匹配问题不在 min/max 职责范围内
