Question

我对JavaScript很陌生，但我遇到了一个问题。我有一个HTMl5页面，其中包含2个time类型的输入元素。我希望得到两次之间的差异，所以11:15和12:00会给我0:45。

我认为HTML非常简单：

<ul>
    <li>
        <label>Anfang: </label>
    </li>
    <li>
        <input type="time" id="begin" required="true">
    </li>
</ul>

<ul>
    <li>
        <label>Ende: </label>
    </li>
    <li>
        <input type="time" id="end" required="true"></li>
</ul>

我猜这里没什么特别的。在我的JavaScript中，我将一个监听器附加到一个按钮，该按钮获取这两个字段的值并将其传递给以下函数以创建日期对象：

function timeToDate(input) {
    var hours = input.substring(0, 2);
    var min = input.substring(3, 5);

    var date = new Date();
    date.setHours(hours);
    date.setMinutes(min);
    return date;

}

为了得到差异，我这样做：

var beginDate = timeToDate(begin);
var endDate = timeToDate(end);
var diff = endDate.getTime() - beginDate.getTime();
var b = new Date();
b.setTime(diff);
console.log(b.getHours());

所以，但是11:00（beginDate）和12:00（endDate）的控制台输出是 2 ，但它应该是1，或者我在这里没有得到线索？

Answer 1

setTime()需要花费数毫秒 UTC 。

另一方面，

getHours()会在当地时区打印小时数。

“一小时太多”您看到，当您打印getHours()时，您的时间偏离UTC。

您可以使用getUTCHours()获得所需的小时。

我假设您仅使用此算法来计算小的正日期差异的hours:minutes表示。那很好。只是不要试图将其应用于更大的持续时间计算。

Answer 2

使用setTime()容易出错 - 因为您实际设置的是UTC时间1970年1月1日以来的毫秒数。

使用getHours将在您的时区中产生一天的时间，这可能与UTC时间不同。

如果您将时间设置为0，您会看到这一点 - getHours()不一定会产生0。

此外，您将获得环绕效果，因此如果您的时间增量超过24小时，您将得到一个模数为24的值。因此，为了计算两个小时之间的差异，我建议您使用常规数学：

var hours = (diff/(1000*60*60))|0;

Answer 3

我认为Date对象不能与时间偏移一起使用。您的代码diff包含两次之间的毫秒数。您可以通过除以60 * 60 * 1000来获得小时数：

var hours=diff/(60*60*1000);

这可能导致分数，例如15分钟的差异将是0.25小时。如果您需要整个小时，可以使用Math.ceil()或Math.floor()向上或向下舍入，例如：

console.log("Full hours: "+Math.ceil(diff/(60*60*1000)));

JavaScript日期差异 - 一小时太多了

3 个答案: