禁用 HTML5 日历中的过去日期答案

【问题标题】：Disable past date in HTML5 calendar禁用 HTML5 日历中的过去日期
【发布时间】：2018-01-06 14:14:52
【问题描述】：

有什么方法可以阻止用户从 HTML5 日历中选择过去的日期，或者如何在 html5 日历中隐藏过去的日期？我只需要用户选择当前日期或未来，而不是过去的日期你能帮我解决这个问题吗？我不想使用任何插件

&lt;input id="start" type="date" data-date-inline-picker="true" class="form-control" name="date"&gt;

【问题讨论】：

标签： javascript html date

【解决方案1】：

您可以通过将min 值指定为今天的日期来做到这一点。日期必须是 ISO 格式 (yyyy-mm-dd) 像这样

&lt;input id="start" type="date" data-date-inline-picker="true" class="form-control" name="date" min="2018-01-06"&gt;

min 和 max 属性必须是完整的日期；无法指定“今天”或“+0”。要动态执行此操作，您需要使用 JavaScript 或这样的服务器端语言：

var today = new Date().toISOString().split('T')[0];
document.getElementsByName("date")[0].setAttribute('min', today);

&lt;input id="start" type="date" data-date-inline-picker="true" class="form-control" name="date" &gt;

【讨论】：

请注意，toISOString 返回 UTC 日期，浏览器会将其解释为本地日期，因此对于东欧的主机，每天早上的主机偏移时间段是错误的格林威治，或者西方人的晚上。因此，虽然意图是正确的，但实施存在缺陷。
@RobG 同意。在这种情况下，我们可以按照David 在他的回答中所说的手动格式化日期:)

【解决方案2】：

您将需要 javascript 来执行此操作：

var today = new Date();
var dd = today.getDate();
var mm = today.getMonth() + 1;
var yyyy = today.getFullYear();
 if(dd<10){
        dd='0'+dd
    } 
    if(mm<10){
        mm='0'+mm
    } 

today = yyyy+'-'+mm+'-'+dd;
document.getElementById("start").setAttribute("min", today);

&lt;input id="start" type="date" data-date-inline-picker="true" class="form-control" name="date" min=""&gt;

【讨论】：

一个好的答案应该包括解释为什么 OP 有问题以及你的代码如何修复它。赞成手动格式化最小日期。 ;-)