如何在Javascript中获取两个日期选择器值之间的时间跨度?

时间:2016-07-12 21:41:29

标签: javascript twitter-bootstrap-3 datetimepicker timespan difference

我在HTML5表单中添加了两个Bootstrap Datetime选择器。到目前为止,我可以使用控件的change事件捕获每个选择器的DateTime值。

现在我有一个案例,两个DateTime选择器之间的时间跨度差异需要存储为var。

我确实遇到过类似于此ask here的示例。但是我的下面的简短实现会在实际时间选择器值发生变化时提醒“Nan”而不是预期的时间跨度差异。

enter image description here

问题:

如何计算Javascript或JQuery中两个日期选择器值之间的时间跨度?

代码要点:

var start;
var actual;

$("#OutageStartDisplay").on("dp.change", function (e) {
    start = $('#OutageStart').val(moment(e.date).format());
});


//On change of the ActualDisplay datetime picker 
//update's the Actual hidden field with the datetime.
$("#ActualDisplay").on("dp.change", function (e) {
    actual = $('#Actual').val(moment(e.date).format());

    //If the actual is set, calculate the outage duration
    var timeDiff = Math.abs(start - actual);
    var diffDays = Math.ceil(timeDiff / (1000 * 3600 * 24)); 
    alert(diffDays);

});

1 个答案:

答案 0 :(得分:1)

由于您正在使用片刻,因此您可以使用moment.diff来获取时差。

您的代码似乎也有点烦恼,当您执行$("whatever").val(something)时,您将"whatever"的值设置为something并返回$("whatever"),而不是值。所以你试图从另一个JQuery对象中减去一个JQuery对象。但即使它返回了val,你的val也是一个字符串 - 你也不能减去它。

所以你可能想要这个:

var start;
var actual;

$("#OutageStartDisplay").on("dp.change", function (e) {
    start = moment(e.date);
    $('#OutageStart').val(start.format());
});

$("#ActualDisplay").on("dp.change", function (e) {
    actual = moment(e.date);
    $('#Actual').val(actual.format());

    //If the actual is set, calculate the outage duration
    alert(actual.diff(start));
});