如何在日历中禁用过去的日期？使用 HTML0

Question

如何使用以下 html 代码禁用日历中的先前日期？

     <div class="form-group">
  <label for="rank" class="cols-sm-2 control-label">Date</label>
   <div class="cols-sm-10">
    <div class="input-group">
     <span class="input-group-addon"><i class="fa fa-calendar" aria-hidden="true"></i></span>
     <input type="date"  id="txtDate" required="Required" class="form-control" name="txtDate" placeholder="Select suitable date" />
    </div>
  </div>
       </div>

Answer 1

问题 here 的答案与您正在寻找的答案非常相似。简而言之，您可以在 <input> 上设置一个 min 属性，它不允许选择该最小值之前的日期。要动态设置最小值，只需使用一点 JavaScript，如下面的代码片段所示。

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

<div class="form-group">
  <label for="rank" class="cols-sm-2 control-label">Date</label>
   <div class="cols-sm-10">
    <div class="input-group">
     <span class="input-group-addon"><i class="fa fa-calendar" aria-hidden="true"></i></span>
     <input type="date"  id="txtDate" required="Required" class="form-control" name="txtDate" placeholder="Select suitable date" />
    </div>
  </div>
</div>

如何在日历中禁用过去的日期？使用 HTML0

How to make the past dates disable in the calendar? using HTML0

html

calendar

disabled-input