如何在input type date控件中禁用指定默认日期之前的日期？

嘿，这个需求其实很容易实现，咱们分两种场景来搞定：

静态固定日期的情况 #

如果你的默认日期是固定的（就像你这里的2018-01-31），直接给<input>标签加上min属性就可以了，把min的值设为你想要限制的最早日期——也就是你的默认日期。

修改后的代码会是这样：

<input required class="data_inizio" type="date" name="inizio" value="2018-01-31" min="2018-01-31">

浏览器会自动识别min属性，禁用所有早于2018-01-31的日期选项，用户根本选不了之前的日期，完美符合你的需求。

动态设置的情况 #

如果你的默认日期是动态生成的（比如从后端获取、或者根据其他条件变化），不想硬写min的值，那可以用JavaScript来动态设置：

// 获取日期输入控件元素
const dateInput = document.querySelector('.data_inizio');
// 把min属性设置为当前的默认值
dateInput.min = dateInput.value;

这样不管你的默认值怎么变，min都会跟着同步，始终限制用户只能选择默认日期及之后的日期。如果之后默认日期有更新，只要重新执行这段代码就能更新限制啦。

内容的提问来源于stack exchange，提问作者Vitto