如何将值设置为小于 min 或大于 max 的输入？

Posted 2023-03-30

【中文标题】如何将值设置为小于 min 或大于 max 的输入？

【英文标题】：How to set a value to an input that is smaller than min or larger than max?

【发布时间】：2021-07-20 06:48:55

【问题描述】：

编辑：问题只是我试图放入输入中的一些数据格式不正确。查看接受的答案以了解更多信息。

我正在使用 type="datetime-local" 的输入字段。我还为所述输入设置了最小值和最大值。我仍然想通过打破这些约束的 javascript 向它添加值，小于最小日期或大于最大日期。但是，当前仅设置值（在本例中为小于 min 的值）会导致输入的时间部分变为空白，如下所示：

datetimeInput = document.createElement('input');
datetimeInput.setAttribute('type','datetime-local');
datetimeInput.setAttribute('step','1');
datetimeInput.setAttribute('min', minTime);
datetimeInput.setAttribute('max', maxTime);

if (data) 
  datetimeInput.value = data.time;

【问题讨论】：

minTime、maxTime、data.time 的值是多少？它们的格式必须为yyyy-mm-ddThh:mm

如果我使用正确的格式，它可以工作：jsfiddle.net/barmar/6753qts8/6

【参考方案1】：

每个国家或地区都有自己的日期时间格式。我所在地区datetime-local类型<input>标签的默认值格式为：

YYYY-MM-DDTHH:MM

如果我要将 <input> 元素的值设置为以下值：

datetimeInput.value = "2017-12-31T00:00";

这将导致值被分配，input 标记现在将显示通过 javascript 分配的日期时间值。

在下面的 sn-p 中看到这个工作。然后，您可以使用您所在地区的默认格式来设置值：

datetimeInput = document.createElement('input');
datetimeInput.setAttribute('type', 'datetime-local');
datetimeInput.setAttribute('step', '1');
datetimeInput.setAttribute('min', "2018-06-07T00:00");
datetimeInput.setAttribute('max', "2018-06-14T00:00");

datetimeInput.value = "2017-12-31T00:00";

document.getElementById("main").appendChild(datetimeInput);

<div id="main"></div>