HTML5 input[type="date"]设必填直接加required属性即可，浏览器原生校验仅检查value非空，不验证日期合法性；需确保在form内通过原生提交触发，旧版Safari存在兼容问题，后端必须二次校验。
HTML5 input[type="date"] 怎么设必填
直接加 required 属性就行，浏览器原生支持校验，不需要 JS 干预。但要注意：这个属性只在表单提交时触发，且仅检查控件是否有值（即 value 非空字符串），不校验日期是否合法（比如 2024-02-30 也会通过）。
常见写法：
注意点：
-
required是布尔属性，写成required="required"或required=""效果一样，但推荐无值写法更简洁 - 若页面加载时
input已有默认值（如value="2024-01-01"），required仍会通过，不会报错 - 部分旧版 Safari（iOS 15.4 之前）对
required+type="date"的支持不稳定，可能跳过校验
为什么加了 required 还能提交空值
本质是用户没选日期时，input.value 是空字符串 ""，而某些场景下（比如用 JS 手动调用 form.submit()、或禁用了默认提交行为），浏览器不会自动触发校验。
立即学习“前端免费学习笔记（深入）”；
确保校验生效的关键条件：
- 必须通过原生表单提交（
内的或回车） -
input必须在标签内，且未设置novalidate - 不要用
event.preventDefault()后又手动submit()，这会绕过校验
如果必须用 JS 提交，应先调用 form.checkValidity() 判断：
if (form.checkValidity()) { form.submit(); } else { form.reportValidity(); }
min 和 max 会影响 required 校验吗
不影响。两者职责分离：required 只管“有没有选”，min/max 只管“选得对不对”。但组合使用时容易产生误导现象：
- 若设了
min="2024-06-01"，用户打开日期选择器时，早于该日的日期置灰不可选——但这不等于“自动填入当天”，value仍是空，required依然生效 - 若用户手动输入非法格式（如
2024/06/01），Chrome 会清空value并视为空值，触犯required；Firefox 则可能保留输入但判定为无效，同样阻止提交 -
min值必须是YYYY-MM-DD格式，写成2024-6-1或2024/06/01会导致整个属性被忽略
移动端日期选择器不弹出？和必填有关吗
无关。required 不影响触发逻辑。弹不出通常是以下原因：
- 没有设置
input的name属性（某些 Android WebView 要求必须有name才激活原生控件） - CSS 中写了
appearance: none或覆盖了input的默认样式，导致点击区域失效 - 父容器设置了
pointer-events: none或遮罩层未正确移除 - 在微信内置浏览器中，部分版本对
type="date"支持差，可降级为type="text"+ 第三方 picker，但此时required仍有效，只是失去原生校验提示
