Question

我正在尝试使用hours & minutes添加格式为moment.js的两个日期。但结果是invalid。

$(document).ready(function() {
  $(".table-class").each(function() {
    var total = 0;
    $(this).find(".timeClass").each(function() {

      var value = $(this).val();

      var start = moment(value, 'h:mma');
      console.log(start);
      total += start;

    });
    $(".total").text(moment(total, 'h:mma'));
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table class="table-class">

  <tr>
    <td>
      <input type="text" value="1 hour 30 mins" class="timeClass">
    </td>

  </tr>
  <tr>
    <td>
      <input type="text" value="3 hours 02 mins" class="timeClass">
    </td>

  </tr>
</table>
<p class="total">

</p>

请提出任何建议，谢谢！

Answer 1

首先，你必须以正确的方式解析你的输入（例如1小时30分钟），这样你就可以使用'h [hour] mm [mins]'代替'h:mma'。请参阅文档的Escaping charaters部分。无论如何，这是一种解决方法，因为＆＃34; 1小时30分钟＆＃34;和＆＃34; 3小时02分钟＆＃34;可能是持续时间，它们并不代表给定的时刻。

作为Default部分状态，momentjs：

默认为今天，只传递小时，分钟，秒和毫秒

因此，使用moment(value, 'h [hour] mm [mins]');您正在为当天创造一个时刻。您可以使用diff()获取自一天开始以来的毫秒数。

最后，您可以使用duration从total变量创建moment.duration(Number)对象。您可以使用hours()和minutes()或使用format()插件moment-duration-format方法显示时刻持续时间的值。

这是一个实时样本：

＆＃13;

$(document).ready(function() {
  $(".table-class").each(function() {
    var total = 0;
    $(this).find(".timeClass").each(function() {
      var value = $(this).val();

      var start = moment(value, 'h [hour] mm [mins]');
      var diff = start.diff(start.clone().startOf('d'));
      total += diff;

    });
    var dur = moment.duration(total);
    $(".total").text(dur.hours() + ':' + dur.minutes());
    // Using moment-duration-format:
    //$(".total").text(dur.format('h:mm'));
  });
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.1/moment.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment-duration-format/1.3.0/moment-duration-format.min.js"></script>

<table class="table-class">
  <tr>
    <td>
      <input type="text" value="1 hour 30 mins" class="timeClass">
    </td>
  </tr>
  <tr>
    <td>
      <input type="text" value="3 hours 02 mins" class="timeClass">
    </td>
  </tr>
</table>
<p class="total"></p>

＆＃13;

使用moment.js格式为小时分钟时添加两次

1 个答案: