min/max 属性需标准 yyyy-mm-dd 格式字符串赋值，动态设置须用 toisostring().slice(0,10)，初始 value 超限时需手动清空，联动时需双向监听并处理空值，且必须前后端校验。
min 和 max 属性能限制 UI 选择范围，但不能替代校验——用户手动输入、粘贴或禁用 JS 后仍可提交非法日期，必须前后端双重把关。
为什么设置了 min/max 却没生效
浏览器会静默忽略不合规的值，常见原因包括：
-
min或max值不是标准YYYY-MM-DD格式：比如"2026-9-21"（缺零）、"2026/09/21"（斜杠）、"2026-09-21T00:00"（含时间） - 用 JavaScript 赋值时用了错误方式：
input.min = new Date()或input.min = Date.now()，必须是字符串：input.min = "2026-09-21" - 初始
value已超出新设的min/max：Chrome 会清空输入框，Firefox 可能保留但checkValidity()返回false，容易误判为“限制失效” - iOS Safari ≤ 15.5 对动态更新支持弱，设完
min后日历不刷新，需补input.dispatchEvent(new Event('input'))或input.focus()
如何动态设置未来 14 天可选范围
不能写死，得用 JS 计算并安全注入。关键不是“怎么算”，而是“怎么塞进去不翻车”：
- 今天：
new Date().toISOString().slice(0, 10)（简洁可靠，无需手拼） - 14 天后：
new Date(Date.now() + 14 * 864e5).toISOString().slice(0, 10)（864e5= 86400000，即一天毫秒数） - 赋值必须用属性直接赋：
input.min = todayStr; input.max = laterStr，别混用setAttribute('value', ...) - 若
input.value已存在且 >input.max，浏览器不会自动清空，需手动判断：if (input.value && input.value > input.max) input.value = ''
两个日期联动时怎么同步 min 才有效
比如“结束日期不能早于开始日期”，只设 end.min = start.value 是不够的：
- 监听
start的change事件，更新end.min = start.value || ''；若start.value为空，必须设为''，否则end将无法选择任何日期 - 监听
end的change事件，做反向校验：if (end.value && start.value && end.value ，此时仅清空 <code>end.value不够，还得调用end.setCustomValidity('结束日期不能早于开始日期')并触发end.reportValidity() - 移动端 Safari 对
min动态更新后 UI 刷新滞后，建议设完后加end.focus(); setTimeout(() => end.blur(), 0)
最容易被忽略的是：不同浏览器对 min/max 的视觉反馈不一致——Safari 可能灰掉超限日期但不阻止键盘输入，Chrome 会禁用日历中的超限项但允许粘贴非法字符串。别假设用户只会点日历。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
