计算2日期和时间之间的小时和分钟

时间:2015-10-02 00:02:03

标签: javascript jquery

希望有人可以帮助我。我有一个表单,我需要用户输入事件的开始时间和结束时间。一旦他们输入了信息,他们就会手动输入2日期时间之间的持续时间。我试图用jquery自动化这个过程并得到一个名为moment http://momentjs.com/的插件。我希望它能让我更简单地计算2个日期时间,但我不得不承认我用jquery javascript来了解它的假设是如何结合起来的。

在旁注中我还需要持续时间字段仅在其为空时计算。我创建了一个jsfiddle http://jsfiddle.net/FLhpq/2044/。这将是我能够复制我的场景的最接近的。这是我到目前为止的代码。

$(document).ready(function() {
    var start_time = $('input[title="start time"]').val();
    var end_time = $('input[title="End time"]').val();
    var d1 = moment(start_time, "YYYY-MM-DD HH:mm");
    var d2 = moment(end_time, "YYYY-MM-DD HH:mm");
    var duration = d2.diff(d1, 'hours')+1;
    var input = $('input[title="duration"]').val();
    if(input == ''){
         $('#duration').val('duration');
 });    

3 个答案:

答案 0 :(得分:2)

我相信你有正确的计算方法。我认为这只是视觉执行。

我把以下小提琴放在一起,因为我认为你正在尝试做什么; jsfiddle.net/...

    $(document).ready(function() {
      var start_time = $('.start').val(),
        end_time = $('.end').val(),
        d1 = moment(start_time, "YYYY-MM-DD HH:mm"),
        d2 = moment(end_time, "YYYY-MM-DD HH:mm"),
        duration = d2.diff(d1, 'hours') + 1,
        $input = $('.duration');
      if ($input.val() === ''){
        $input.val(duration);
      }
   });

在你原来的小提琴里。没有ID和#34;持续时间"的元素。另外,对于抓取元素,请尝试使用选择器的类名。我在输入中添加了一些简单的类,以便更轻松地使用jQuery抓取它们。

从这里开始,如果你想另外显示分钟/秒,你可以通过使用一些瞬间改变你的持续时间逻辑。内置的功能,如to

我相信以下内容;

duration = d1.to(d2) // RETURNS MOMENT

希望这会帮助你!

答案 1 :(得分:0)

你应该看看 this

         var a = moment([2007, 0, 28]);
         var b = moment([2007, 0, 29]);
         a.to(b);                     // "in a day"

或者

          var a = moment([2007, 0, 29]);
          var b = moment([2007, 0, 28]);
          a.diff(b, 'days') // 1

答案 2 :(得分:0)

这将显示小时(和分钟),并在duration字段为空时显示:

$(document).ready(function() {
    if($('#duration').val() === '') {
        updateDuration($('#start_time').val(), $('#end_time').val());
    }

    $('#start_time').on('change keyup', function() {
        updateDuration($('#start_time').val(), $('#end_time').val());
    });

    $('#end_time').on('change keyup', function() {
        updateDuration($('#start_time').val(), $('#end_time').val());
    });

    function updateDuration(startTime, endTime) {
        var ms = moment(endTime, 'YYYY/MM/DD HH:mm:ss').diff(moment(startTime, 'YYYY/MM/DD HH:mm:ss')),
            dt = moment.duration(ms),
            h  = Math.floor(dt.asHours()),
            m  = moment.utc(ms).format('mm');

        $('#duration').val(h + ' hours, ' + m + ' minutes');
    }
});

如果用户更改了值,这也会更新duration输入字段。

你可以在这里看到一个有效的JSFiddle:

http://jsfiddle.net/divspace/9x0s01oy/