min/max 日期属性必须为严格“yyyy-mm-dd”字符串格式，javascript 动态设置需手动格式化本地日期，避免 toisostring() 等含时区方法，并注意 ios safari 兼容性问题。
min/max 日期属性必须是 YYYY-MM-DD 格式字符串
浏览器只认 min 和 max 属性值为严格符合 "YYYY-MM-DD" 的字符串，哪怕多一个空格、少一位年份，都会被忽略——这时表单就退化成无限制的日期输入。JavaScript 动态设置时，不能直接用 new Date() 对象，必须手动格式化。
常见错误是写成：input.min = new Date() 或 input.min = date.toISOString()（后者带时间部分，如 "2024-05-20T00:00:00.000Z"），浏览器会静默失效。
- 正确做法：用
date.toISOString().slice(0, 10)（安全，但依赖本地时区偏移） - 更稳妥：手动拼接
${date.getFullYear()}-${String(date.getMonth() + 1).padStart(2, '0')}-${String(date.getDate()).padStart(2, '0')} - 注意：
getMonth()返回 0–11，必须 +1；getDate()不补零也合法，但补零更统一
动态绑定当天日期作为 min 值的典型场景
比如注册表单要求“出生日期不能晚于今天”，或预约系统要求“最早可选日期为今天”。这类逻辑不能靠 HTML 静态写死，因为页面可能长期缓存，第二天打开仍显示昨天的 min 值。
必须在页面加载时（或组件挂载时）执行 JS 设置。如果用了框架（如 Vue/React），也要确保在 DOM 渲染完成后再操作 input 元素。
- 原生 JS 示例：
const today = new Date();<br>const input = document.querySelector('input[type="date"]');<br>input.min = `${today.getFullYear()}-${String(today.getMonth() + 1).padStart(2, '0')}-${String(today.getDate()).padStart(2, '0')}`; - 若页面有多个日期输入框，需分别处理，不能共用同一个
min值变量（除非逻辑一致） - 设置后用户仍可能手动输入无效日期（如粘贴），建议配合
onchange或onblur做二次校验
max 设为今天时容易忽略时区问题
用户设备时区会影响 new Date() 解析结果。例如服务器在 UTC+8，用户在 UTC-5，调用 new Date().toISOString().slice(0,10) 得到的是 UTC 时间对应的日期，比本地日期早一天，导致 max 被设小了。
最简方案是完全基于本地时间构造字符串，不经过 ISO 时间转换：
- 用
new Date().getFullYear()等方法获取本地年月日 - 避免
toUTCString()、toISOString()等含时区的方法 - 如果业务强依赖服务端日期（如“截止到服务端今日”），那就不能靠前端
min/max控制，得用后端校验 + 前端提示
移动端 Safari 对动态设置 min/max 支持不稳定
iOS 15.4 之前版本存在 bug：通过 JS 设置 input.min 后，原生日期选择器弹出时仍显示默认范围（不限制）。这不是代码写错，而是渲染时机问题。
临时缓解办法：
- 在设置
min后，给input触发一次blur()再focus()，强制重绘 - 或者延迟 10ms 设置（
setTimeout(() => { input.min = ... }, 10)） - 终极方案：不依赖原生限制，改用 JS 库（如 flatpickr）或自定义日期选择器，可控性更强
这个坑没法靠“写对格式”绕过，得实测目标机型和 iOS 版本。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
