HTML date input 无法选择日期主因是缺失或覆盖 type="date"，且受浏览器兼容性限制；值必须为 YYYY-MM-DD 格式，否则初始化失败；移动端需点击下拉箭头触发日历；提交为空需检查格式、支持度及后端解析配置。
HTML date input 为什么选不了日期
浏览器没反应、点开空白、或者只显示文本框——大概率是 input 缺了 type="date"，或写了但被其他属性（比如 type="text"）覆盖了。html 原生 date 类型依赖浏览器原生控件，不是所有环境都支持：ios safari 旧版本、部分安卓 webview、ie 完全不支持，会自动退化为普通文本框。
实操建议：
- 必须写
<input type="date">，不能靠 CSS 或 JS “模拟”出 date 效果 - 加
required属性能触发浏览器校验，但不会阻止用户输入无效格式（比如 2023-02-30），提交时才报错 - 值始终是
YYYY-MM-DD格式字符串，和本地显示格式无关（例如中文系统仍返回"2024-05-20"） - 不要用
value写成"2024/05/20"或"2024年5月20日"，否则控件初始化失败，value会被清空
怎么让 date input 默认选中今天
直接设 value 为当前日期的 ISO 字符串即可，不需要 JS 初始化（除非要动态计算）。注意：new Date().toISOString().slice(0,10) 是最稳妥的取法，避免时区偏移导致昨天或明天。
常见错误现象：
-
value="2024-5-20"→ 缺前导零，浏览器识别失败，显示为空 -
value="2024-05-20T00:00:00"→ 含时间部分，type="date"忽略，但部分浏览器会清空输入框 - 服务端渲染时硬编码
value="2024-05-20"→ 用户打开页面那天就过期了
推荐写法（服务端或构建时生成）：
<input type="date" value="<%= new Date().toISOString().slice(0,10) %>">
立即学习“前端免费学习笔记（深入）”；
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
date input 在移动端点不开日历怎么办
不是 bug，是特性：iOS Safari 和部分安卓浏览器默认禁用原生日历弹窗，除非用户主动点击输入框内右侧的下拉箭头（小三角）。如果整个输入框区域不可点，检查是否被 pointer-events: none、遮罩层、或 z-index 覆盖。
关键限制：
- 不能用
click()触发日历（浏览器禁止程序唤起日期选择器） - 不能通过
focus()强制弹出日历，仅聚焦光标 - 自定义按钮 +
input.click()无效，原生控件不响应 - 如需兼容性更强，得上第三方库（如 flatpickr），但会失去原生语义和无障碍支持
后端收到的 date 值为什么是空的
表单提交时 input[type=date] 为空，有三种典型情况：用户没选、浏览器不支持退化为 text 且用户没手动填、或值格式非法被浏览器丢弃。Chrome/Firefox 会校验格式，非法值（如 "2024-13-01"）提交时该字段直接不发送。
排查要点：
- 检查 Network 面板里 Form Data，确认字段是否存在，而不是只看 JS 的
value - 服务端别假设字段一定存在，要做空值判断（
req.body.date === undefined或""） - 如果用了
FormData手动提交，确保没漏掉append("date", input.value)，空值也要显式传 - Node.js + Express 默认不解析
application/x-www-form-urlencoded中的空字段，需确认urlencoded中间件配置了extended: true
时区其实不干扰：无论用户在哪，input[type=date] 提交的永远是本地日期对应的 YYYY-MM-DD，没有时分秒，也无 UTC 偏移。
