You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何用JavaScript让HTML datetime-local输入框默认显示今日日期且隐藏秒数

解决datetime-local输入框默认显示今日日期且隐藏秒数的问题

直接使用valueAsDate赋值会让浏览器自动生成包含秒数的完整格式,要同时实现默认今日日期+无秒展示,需要手动格式化日期为YYYY-MM-DDTHH:mm格式后,赋值给输入框的value属性,具体代码如下:

修改后的JavaScript代码

// 设置datetime-local输入框默认显示今日日期(不带秒数)
const dateInput = document.getElementById("DATE");
const now = new Date();
// 提取并格式化日期时间各部分,补前导零保证两位格式
const year = now.getFullYear();
const month = String(now.getMonth() + 1).padStart(2, '0');
const day = String(now.getDate()).padStart(2, '0');
const hours = String(now.getHours()).padStart(2, '0');
const minutes = String(now.getMinutes()).padStart(2, '0');
// 拼接成符合datetime-local要求的无秒格式字符串
dateInput.value = `${year}-${month}-${day}T${hours}:${minutes}`;

对应的HTML代码

<input type="datetime-local" id="DATE" name="Date" placeholder="" class="vcheck" required minlength="8">

说明

  • 月份需要加1:因为JavaScript的Date.getMonth()返回值是0-11(0代表一月),所以要手动加1后再格式化
  • padStart(2, '0')用于确保月份、日期、小时、分钟都是两位数字(比如把5转为05),符合datetime-local的格式要求
  • 直接赋值格式化后的字符串给value属性,会强制输入框以无秒的形式展示今日日期

内容的提问来源于stack exchange,提问作者genericdude76

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.22 08:40:06