如何在日曆中禁用過去的日期？使用HTML0

-1

如何使用以下html代碼在日曆中禁用以前的日期？如何在日曆中禁用過去的日期？使用HTML0

 <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>

來源

2017-03-12 sikanderkhursheed

什麼？什麼日曆？你還沒有提供任何HTML。你甚至在問什麼？ – Unlocked

我已通過添加代碼編輯了我的問題。請檢查它 – sikanderkhursheed

可能重複[禁用某些日期從html5 datepicker]（http://stackoverflow.com/questions/17182544/disable-certain-dates-from-html5-datepicker） –

問題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>

來源

2017-03-12 07:44:10

謝謝很多傑克它解決了我的問題。讚賞 – sikanderkhursheed

如何在日曆中禁用過去的日期？使用HTML0

回答

相關問題