如何使用 AM 和 PM 添加 24 小时到 12 小时的时间戳？答案

【问题标题】：How to i add 24 hours to 12 hours timestamp with AM and PM?如何使用 AM 和 PM 添加 24 小时到 12 小时的时间戳？
【发布时间】：2018-05-03 17:21:05
【问题描述】：

我制作了以下代码以获得实时。但我不明白，如何添加时间戳 24 小时到 12 小时和 AM PM。

setInterval(function() {
  var date = new Date();
  var hours = date.getHours();
  var seconds = date.getSeconds();
  var minutes = date.getMinutes();
  var realTime = (hours < 10 ? '0' : '') + hours + ':' + (minutes < 10 ? '0' : '') + minutes + ':' + (seconds < 10 ? '0' : '') + seconds
  $('#time').html(realTime);
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="time"></div>

【问题讨论】：

尝试使用date-fns库。它轻巧而强大
使用momentjs.com

标签： javascript jquery datetime timestamp

【解决方案1】：

你可以按照这个方法（cmets inline）

setInterval(function() {
  var date = new Date();
  var hours = date.getHours();
  var seconds = ("0" + date.getSeconds()).slice(-2);
  var minutes = ("0" + date.getMinutes()).slice(-2);
  var amPM = hours < 12 ? "AM": "PM"; //decides if this is AM or PM based on hours value
  hours = ("0" + (hours % 12)).slice(-2); //pad 0 prefix 
  var realTime = hours + ':' + minutes + ':' + seconds + " " + amPM; //prepare the date format
  $('#time').html(realTime);
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="time"></div>

【讨论】：

我可以在没有零的情况下运行几个小时 0 。如果我从这里删除零 hours = ("0" + (hours % 12)).slice(-2); 到 hours = ("" + (hours % 12)).slice(-2); 现在时间显示我没有零。没事吧？
是的，在这种情况下，您也可以删除slice(-2)，保留hours = (hours % 12)

【解决方案2】：

setInterval(function() {
  var now = moment().format("hh:mm:ss a");
  $('#time').html(now);
}, 1000);

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.2/moment.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="time"></div>

您可以使用momentjs 并使用format("hh:mm:ss a") 格式化

【讨论】：

【解决方案3】：

setInterval(function() {
  var date = new Date();
  var hours = date.getHours();
  var seconds = date.getSeconds();
  var minutes = date.getMinutes();
  if (hours > 12){hours = hours -12; amPM = ' PM'}else{amPM = ' AM'}
  var realTime = (hours < 10 ? '0' : '') + hours + ':' + (minutes < 10 ? '0' : '') + minutes + ':' + (seconds < 10 ? '0' : '') + seconds + amPM
  $('#time').html(realTime);
}, 1000);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="time"></div>

【讨论】：

在 SO 中不能很好地接受仅代码的答案。此外，您的代码在下午 15:22:22 生成，这是错误的。
@VTodorov 他的代码为我输出 13:24:40 PM，这是正确的。也许这取决于你在哪里？
@MasterYoda 13 PM 是错误的。应该是下午 1 点。这不是使用 AM/PM 的想法吗？