在HTML5日历中禁用过去的日期

Question

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

 <input id="start" type="date" data-date-inline-picker="true" class="form-control" name="date"> 

Answer 1

您可以通过指定当前日期的min来实现。 这样的日期必须是ISO格式(yyyy-mm-dd)

 <input id="start" type="date" data-date-inline-picker="true" class="form-control" name="date" min="2018-01-06"> 

最小和最大属性必须为完整日期； 无法指定“今天”或“ +0”。 要动态地执行此操作，您需要使用JavaScript或服务器端语言，例如：

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

 <input id="start" type="date" data-date-inline-picker="true" class="form-control" name="date" > 

Answer 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); 

 <input id="start" type="date" data-date-inline-picker="true" class="form-control" name="date" min="">