如何将datetime-local输入框的分钟预设并固定为00？

要让datetime-local类型输入框的分钟始终固定为00，需要从初始化默认值和监听用户输入并修正两个层面处理：

1. 初始化默认值（可选） #

如果希望页面加载时就显示当前时间且分钟为00，可以通过JavaScript生成符合规范的格式字符串赋值：

const dateControl = document.getElementById('datetime_regular_start');
const now = new Date();
// 构造YYYY-MM-DDTHH:00格式的合法值
const formattedDate = `${now.getFullYear()}-${String(now.getMonth()+1).padStart(2, '0')}-${String(now.getDate()).padStart(2, '0')}T${String(now.getHours()).padStart(2, '0')}:00`;
dateControl.value = formattedDate;

2. 监听输入事件，强制修正分钟为00 #

datetime-local的输入值必须严格遵循YYYY-MM-DDTHH:mm格式，用户选择或手动输入后，我们需要监听input事件，将分钟部分强制替换为00：

const dateControl = document.getElementById('datetime_regular_start');

dateControl.addEventListener('input', function() {
  if (!this.value) return;
  // 截取到小时部分，拼接固定的:00
  const fixedValue = this.value.slice(0, 13) + ':00';
  this.value = fixedValue;
});

关键说明 #

• 你之前尝试的"yyyy-mm-dd-HH:00"是无效的，因为datetime-local的value只能接受具体的日期时间字符串，不能使用占位符格式。
• 上述代码会在用户选择任意时间后自动重置分钟为00，确保最终输入的时间分钟始终为00。

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