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

时间:2014-09-14 03:02:16

标签: html5 input time format

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

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

我做错了什么?

4 个答案:

答案 0 :(得分: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 :(得分:1)

StephenGiri, 为了获得AM / PM设置,您要做的就是将12小时时间字符串转换为24小时时间字符串,然后再将其传递到输入[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}`;
}

希望这会有所帮助:)

答案 2 :(得分:1)

将 AM/PM 时间字符串转换为 24 小时格式。例如晚上 9:30 到 21:30

function convertTimeFrom12To24(timeStr) {
  var colon = timeStr.indexOf(':');
  var hours = timeStr.substr(0, colon),
      minutes = timeStr.substr(colon+1, 2),
      meridian = timeStr.substr(colon+4, 2).toUpperCase();
    
  var hoursInt = parseInt(hours, 10),
      offset = meridian == 'PM' ? 12 : 0;
  
  if (hoursInt === 12) {
    hoursInt = offset;
  } else {
    hoursInt += offset;
  }
  return hoursInt + ":" + minutes;
}
console.log(convertTimeFrom12To24("12:00 AM"));
console.log(convertTimeFrom12To24("12:00 PM"));
console.log(convertTimeFrom12To24("11:00 AM"));
console.log(convertTimeFrom12To24("01:00 AM"));
console.log(convertTimeFrom12To24("01:00 PM"));

答案 3 :(得分:0)

这对我有用:

<input class="form-control" type="time" name="time" value="<?=date("H:i", strtotime($dbObject['time'])); ?>" />

通过这种方式,可以获取时间列并使用PHP和mysql这样显示它。