input type="date" 的 min/max 属性需严格满足 ISO 8601 格式（YYYY-MM-DD）、正确赋值及边界处理，否则静默失效；动态设置须用 toISOString().slice(0,10)，联动时需事件监听与手动同步，并辅以服务端校验和用户体验补位。
直接在 input type="date" 上写 min 和 max 属性就能生效，但必须严格满足格式、赋值方式和边界处理三方面要求，否则浏览器会静默忽略。
min/max 的基础写法与格式要求
这两个属性只接受形如 "2026-09-25" 的 ISO 8601 标准字符串（YYYY-MM-DD），多一位、少一位、用斜杠、带时间或时区都会失效：
- ✅ 正确：
min="2026-09-25"、max="2026-10-25" - ❌ 错误：
min="2026/09/25"、min="2026-9-25"（缺零）、min="2026-09-25T00:00"（含时间）
动态设置日期范围的可靠方法
业务中多数需根据当前时间计算，比如“仅可选今天起 14 天内”。关键不是算不对，而是塞不进去：
DeepBI DHTML 页面生成器
下载
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
- 用
toISOString().slice(0, 10)获取标准格式字符串，例如：const today = new Date().toISOString().slice(0, 10); - 计算未来日期推荐用毫秒运算：
const later = new Date(Date.now() + 14 * 86400000).toISOString().slice(0, 10); - 赋值必须用
input.min = today或input.setAttribute('min', today)，避免直接拼接错误 - 若 input 已有 value 且超出新 max，浏览器不会自动清空，需手动判断并重置：
if (input.value && input.value > input.max) input.value = '';
两个日期联动时的同步要点
例如“结束日期不能早于开始日期”，只设 end.min = start.value 是不够的：
立即学习“前端免费学习笔记（深入）”；
- 监听
start的change事件：当start.value为空时，必须同步清除end.min，否则end将无法选择任何日期 - 监听
end的change事件：若发现end.value ，调用 <code>end.setCustomValidity('结束日期不能早于开始日期')并立即end.reportValidity() - 在 Safari（尤其 iOS ≤ 15.5）中，设完
end.min后 UI 日历可能不刷新，建议加end.focus(); setTimeout(() => end.blur(), 10);
必须配合的服务端与体验补位
min/max 是客户端辅助约束，不是安全机制：
- 用户仍可通过粘贴、开发者工具修改或禁用 JS 绕过限制，服务端必须重新校验日期字符串是否在合法范围内
- 建议加上
required防止空值提交 - 对非法输入做实时反馈，例如在
oninput中检查!input.checkValidity()并显示提示 - 移动端 WebView（如微信内置浏览器）对 min/max 支持不稳定，关键场景建议增加 fallback 提示或二次确认
