Question

我试图获得两次输入之间的差异并将其显示为HH：mm：ss。

为显示创建了一个带有id="diff"的输入框。此代码最长可达24小时差异，这就是我所需要的。

但是，当开始或结束时间的秒输入为0（例如，11：10：00 PM）时，显示反映NaN。

任何人都知道这里的问题是什么？

var start = document.getElementById("start").value;
var end = document.getElementById("end").value;

function diff(start, end) {
    start = start.split(":");
    end = end.split(":");
    var startDate = new Date(0, 0, 0, start[0], start[1], start[2], 0);
    var endDate = new Date(0, 0, 0, end[0], end[1], end[2], 0);

    //for calculation to work if endtime cross over next day. Eg. 11pm to 2am
    if (endDate.getTime() < startDate.getTime()) {
        endDate.setDate(endDate.getDate() + 1);
    }

    var diff = endDate.getTime() - startDate.getTime();

    var hours = Math.floor(diff / 1000 / 60 / 60);
    diff -= hours * 1000 * 60 * 60;
    var minutes = Math.floor(diff / 1000 / 60);
    diff -= minutes * 1000 * 60;
    var seconds = Math.floor(diff / 1000);


    return (hours < 9 ? "0" : "") + hours + ":" + (minutes < 9 ? "0" : "") + minutes + ":" + (seconds < 9 ? "0" : "") + seconds;

}

document.getElementById("diff").value = diff(start, end);

<input type="time" id="start" step="1" value="">
<input type="time" id="end" step="1" value="">
<input id="diff">

Answer 1

那是因为你的“00”在几秒钟内永远不会过去。只有几分钟和几小时。因此，当发生这种情况时，您的日期无效。

只检查split数组的最后一个参数，如果t不存在则传递零。

尝试更改此内容：

var startDate = new Date(0, 0, 0, start[0], start[1], start[2], 0);
var endDate = new Date(0, 0, 0, end[0], end[1], end[2], 0);

到此：

var startDate = new Date(0, 0, 0, start[0], start[1], start[2] ? start[2] : 0, 0);
var endDate = new Date(0, 0, 0, end[0], end[1], end[2] ? end[2] : 0, 0);

在javascript中计算两次输入的差异，以秒为单位

1 个答案: