html5时间输入显示12小时

Question

html5时间输入显示12小时

我正在使用html 5输入元素type=time。问题是它显示时间，12 hours但我希望它在24 hours一天中显示它。我怎样才能达到24小时？这是我的输入字段

<input type="time" name="time" placeholder="hrs:mins" pattern="^([0-1]?[0-9]|2[0-4]):([0-5][0-9])(:[0-5][0-9])?$" class="inputs time" required>

DEMO

这是jsfiddle

Answer 1

HTML5时间输入这是最简单的日期/时间相关类型，允许用户选择24小时制，无AM或PM的时间。返回的值是小时：分钟，看起来像14:30。<input&nbsp;type="time"&nbsp;name="time"&nbsp;/>此功能仍在草稿中。每个浏览器以不同方式显示- Opera（Presto Engine）以正确的方式显示它。- Chrome（Webkit Engine）在上午/下午显示它。- Firefox（Gecko Engine）没有显示任何内容，但验证结果。- Edge在弹出窗口类型窗口中显示所有必需值<input&nbsp;type="time"&nbsp;name="time"&nbsp;/>使用不是一个好主意！

Answer 2

它取决于启动Web浏览器时用户操作系统的时间格式。所以：如果计算机的系统首选项设置为使用24小时制，则浏览器将<input type="time">元素呈现为--:--（时间范围：00：00-23：59）。如果将计算机的系统首选项更改为使用12小时，则在退出并重新启动浏览器之前，输出不会更改。然后它将改为--:-- --（时间范围：上午12:00 - 下午11:59）。而且（截至本文撰写时），浏览器支持率仅为75％左右（caniuse）。Yay：Edge，Chrome，Opera，Android。Boo：IE，Firefox，Safari）。