如何獲取Javascript中兩個日期選擇器值之間的時間跨度？

Question

我在HTML5表單中添加了兩個Bootstrap Datetime選擇器。 到目前為止，我可以使用控件的change事件捕獲每個選擇器的DateTime值。

現在，我需要將兩個DateTime選擇器之間的時間跨度差異存儲為var。

我也碰到過類似這樣的例子在這里提問 。 但是，當更改實際時間選擇器的值時，下面的簡短實現會警告“ Nan”的值，而不是預期的時間跨度差異。

題：

如何在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);

});

Answer 1

由於使用的是矩，因此可以使用moment.diff來獲取時差。

您的代碼似乎也有些bug，當您執行$("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));
});