如何设置 type='datetime-local' 的输入的最小值和最大值？

Question

我有一个输入字段，应该向 mysql 发送一个值，我想设置最大值和最小值来预测用户可以选择的日期范围。

此输入是一个日期时间本地字段，因为我希望他也选择时间。

我知道如何将其设置为日期，但无法让它工作。也许我错过了什么？

这是我的小提琴

  <label>This is datetime-local</label>

<input type='datetime-local' min='2017-06-14 00:00:00' max='2017-06-16 00:00:00'>

  <label>This is date</label>

<input type='date' name="date" min="2017-06-14" max="2017-06-16">

Answer 1

尽管这里声明了什么，我也让它工作增加了秒数，比如 yyyy-MM-ddThh:mm:ss

<input type="datetime-local" id="start-date" min="2021-06-07T14:47:57" />

我需要最小输入为“今天”，因此使用 JS：

let dateInput = document.getElementById("start-date");
dateInput.min = new Date().toISOString().slice(0,new Date().toISOString().lastIndexOf(":"));

那么日历不会让你超过那个最短日期。您可以为 max 属性应用相同的代码。

Answer 2

具有最小值和最大值的示例

<input
    type="datetime-local"
    className="form-control mt-2"
    name="start_date"
    min="2011-02-20T20:20"
    max="2031-02-20T20:20"
/>