html - 对于限制为未来 7 天的日期，正确的 HTML 输入类型？

Question

我需要用户能够指定未来的日期和时间，从当前日期和时间到未来 7 天。

我认为日期选择器不是最好的方法，因为许多用户会选择今天之前的日期或未来 7 天以上的日期。

那么最好的方法是什么？

我可能的解决方案：

我应该创建多个旋转框，一个单独的：小时，分钟，日，月，年：

<input type="number" min="1" max="31" step="1" value="12" required>

但是还有一个月 30 天和 31 天、闰年等问题。

那么有人有更好的主意吗？

Answer 1

使用纯 HTML 将验证的负担放在了浏览器上。不能信任浏览器验证。

如果您想要一个不会给您的用户带来太多挫败感的丰富 UI 体验，我建议使用 datepicker 小部件，例如 jQuery UI 中包含的小部件。使用 jQuery 日期选择器，您可以限制可供选择的日期。

请参阅：如何通过给出两个日期来限制 jquery datepicker 的日期范围？

Answer 2

使用具有最大值限制的日期输入。

<input type="date" min="2013-06-28" max="2013-07-04" required>

即使不是所有浏览器都完全支持日期输入，您也必须在服务器端进行验证。如果用户选择的日期超出限制，您还可以在输入旁边显示错误消息。