HTML5输入类型时间设置值不起作用

问题描述 投票:12回答:2

我有一个输入类型时间的表单。我正在努力设定价值观。但它没有表现出来。这是我的代码。

<input type="time" name="exit" id="teacher-entry-exit-form-exit-input" class="form-control" value="08:56 AM" required="">

我究竟做错了什么?

html5 input time format
2个回答
22
投票

它基于24小时的时间,因此使用value="08:56"用于AM和value="20:56"用于PM。

Example Here

<input type="time" value="08:56">

见:http://www.w3.org/TR/html-markup/input.time.html


1
投票

StephenGiri,为了获得AM / PM设置,你所要做的就是将你的12小时时间字符串转换为24小时时间字符串,然后将其传递给input [type = time]的value属性。

这是一个快速example如何转换12小时 - > 24小时时间字符串。

const am_pm_to_hours = time => {
    let hours = Number(time.match(/^(\d+)/)[1]);
    let minutes = Number(time.match(/:(\d+)/)[1]);
    const AMPM = time.match(/\s(.*)$/)[1];
    if (AMPM.toLowerCase() === "pm" && hours < 12) hours = hours + 12;
    if (AMPM.toLowerCase() === "am" && hours == 12) hours = hours - 12;

    let sHours = hours.toString();
    let sMinutes = minutes.toString();
    if (hours < 10) sHours = "0" + sHours;
    if (minutes < 10) sMinutes = "0" + sMinutes;

    return `${sHours}:${sMinutes}`;
}

希望这可以帮助 :)

© www.soinside.com 2019 - 2024. All rights reserved.