第二个不显示在类型=“datetime-local”和步骤=“1”的html输入上

Question

即使使用 type =“datetime-local”和 step =“1”，我也无法让第二个显示在输入字段中，但它显示为 type =“time”。我在 Android 上尝试了多种浏览器，包括 Chrome、Edge、Firefox 等。

可以在这个问题的第一个测试框中复现如下图：

我做错了什么？如何让日期时间本地框中的输入显示秒数？

Answer 1

大多数浏览器中的

type="datetime-local"

控件默认不显示秒字段，无论

step

大小如何。同时，

type="time"

确实显示秒字段。这是基于浏览器开发人员的 UI 决策，不幸的是，不能使用 HTML 或 JavaScript 来控制或修改。

所以我通常做的是使用一个名为 moment 的库来帮助解决这种情况：

<!-- Moment.js -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js"></script>

<!-- HTML -->
<input type="datetime-local" id="datetime" name="datetime">

<!-- JavaScript -->
<script>
  document.addEventListener('DOMContentLoaded', (event) => {
    const inputDateTime = document.getElementById('datetime');
    inputDateTime.value = moment().format("YYYY-MM-DDTHH:mm:ss");
  });
</script>