在Datetime中禁用今天的日期

Question

$(document).ready(function(){
    elem = document.getElementById("date")
    var iso = new Date().toISOString();
    var minDate = iso.substring(0,iso.length-1);
    elem.value = minDate
    elem.min = minDate
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form>
<input type="datetime-local" id="date" />
</form>

我在我的网页上使用an HTML5 datetime-local <input>作为日期选择器。如何在控件中禁用今天的日期，以便用户只能选择将来的日期？

Answer 1

请检查此代码，以便在当天添加一天。

<script>
$(document).ready(function(){  
 elem = document.getElementById("date")
  var d=new Date();
  d.setDate(d.getDate()+1);

  var iso = d.toISOString();
  var minDate = iso.substring(0,iso.length-1);
  elem.value = minDate
  elem.min = minDate });
</script>

Answer 2

有了var minDate = iso.substring(0,iso.length-1);，你最终会得到像2019-03-28T12:30:21.000这样的东西。 ISO日期字符串看起来像2019-03-28T12:30:21.000Z，所以你所做的只是剥离Z。

将其更改为.substring(0, 10)。

$(document).ready(function() {
  var elem = $('#date');
  var iso = new Date().toISOString();
  var minDate = iso.substring(0, 10);
  elem.value = minDate;
  elem.min = minDate;
});

请注意，这将允许您选择将来的日期，包括今天。明天以后，与var iso = new Date().toISOString();交换var iso = new Date(new Date().valueOf() + 86400000);。

86400000是1000ms (1 second) * 60 * 60 * 24。

1秒* 60 = 1分钟 1分钟* 60 = 1小时 1小时* 24 = 1天

对于datetime-本地....

$(document).ready(function() {
  var ONE_DAY = 86400000;
  var elem = document.getElementById('date');
  var minDate = new Date();
  minDate.setHours(0);
  minDate.setMinutes(0);
  var iso = new Date(minDate.valueOf() + ONE_DAY).toISOString();
  var minDateString = iso.substring(0, iso.length - 8);
  elem.value = minDateString;
  elem.min = minDateString;
});

请注意，仍然可以输入无效值，因为附加验证取决于字段的浏览器实现。有关更多信息，请参阅https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/datetime-local#Validation。