如何禁用过去的日期？

Question

如何实时禁用代码的过去日期？

<div class="form-group">
     <label>Check-In</label>
     <input name="cin" type ="date" class="form-control">

 </div>
 <div class="form-group">
     <label>Check-Out</label>
     <input name="cout" type ="date" class="form-control">

 </div>

Answer 1

您可以通过使用一点JavaScript和min属性来禁止以前的日期：

let [today] = new Date().toISOString().split("T");
document.querySelector("input").setAttribute("min", today);

<input name="cin" type ="date" class="form-control">

这将自动更新。如果您不希望在固定日期（例如2019年元旦）之前允许任何签入，则只需手动设置min属性：

<input name="cin" type ="date" class="form-control" min="2019-01-01">