如何将 <input> 时间格式设置为 24 小时（chrome）[重复]答案

【问题标题】：How to make <input> time format to 24 hours (chrome) [duplicate]如何将 <input> 时间格式设置为 24 小时（chrome）[重复]
【发布时间】：2017-06-27 07:11:01
【问题描述】：

需要帮助将时间格式从 12 小时改为 24 小时。我删除了上午/下午标记，现在我不知道如何将其更改为 24 小时。

我不熟悉 Javascript，所以这给我带来了问题。也许有人可以给我详细的代码如何制作？

.without::-webkit-datetime-edit-ampm-field {
  display: none;
}

&lt;input type="time" id="time" name="bday" value="21:00" step="1800" min="00:00" max="23:59" required class="without" autofocus&gt;

【问题讨论】：

https://stackoverflow.com/questions/22347521/change-time-format-to-24-hours-in-javascript
它适用于我（我什至可以设置例如23:30）。请注意，input type="time" 并未得到广泛支持（ * 对 Firefox 而言... * ）并且它取决于的语言环境。
在 mozilla 上看起来不错，但在 chrome 上不行。它还禁用了 Mozilla 中的导航箭头，无法以 30 分钟（step="1800"）间隔导航。

标签： javascript google-chrome input time

【解决方案1】：

在剃须刀页面中，在 Chrome 浏览器中：

 <input type="datetime-local" name="<>" id="<>" value=@string.Format("{0:yyyy-MM-ddTHH:mm}",Model.<your model name>)/>

HH 表示 24 小时制。 hh 表示 AM/PM 格式

【讨论】：

【解决方案2】：

不同的浏览器对此输入type="time" 显示不同的响应。尝试过 Chrome、Firefox、Edge 和 IE。最好的办法是编写自定义 javascript 函数来处理输入事件。

注意：

<input type="time" id="time">
<input type="time" id="time" name="bday" pattern="([1]?[0-9]|2[0-3]):[0-5][0-9]">

这些模板适用于旧版浏览器，但不适用于最新版本的 Chrome 和 Firefox，并显示 12 小时格式。

【讨论】：

【解决方案3】：

以下内容无需 Javascript 即可工作

&lt;input type="time" id="time" name="bday" pattern="([1]?[0-9]|2[0-3]):[0-5][0-9]"/&gt;

【讨论】：

在我的笔记本电脑上，它设置为英语和火狐，这个输入类型显示 12h AM/PM 格式。所以它可能只在你的机器上使用本地设置。