0

我正在使用 Tempus Dominus Bootstrap 4 为我正在从事的项目创建一个基于 Web 的时钟。作为时钟的一部分，我正在创建一个页面，用户将在其中输入他们可以工作的时间。我在如何计算总小时数上遇到了障碍。我已阅读文档，但无法找到计算时间差的方法。

我在名为#sun_start 的一次性选择器中拥有的东西，以及名为#sun_end. 当用户输入时#sun_end time，我想计算两者之间的时间差，并将其显示在名为 的 div 区域中#sun_hours。我找不到可以返回输入时间的函数，因此我可以进行计算。任何帮助将不胜感激。谢谢，特洛伊

4

1 回答 1

0

只是一个更新。我找到了解决我的问题的方法。随着对 moment.js 和一些 javascript 的持续研究，我想出了以下解决方案：

$(function () {
$('#sun_start').datetimepicker({
    format: 'H:mm',
    stepping: 15
});
$('#sun_end').datetimepicker({
    format: 'H:mm',
    stepping:15,
    useCurrent: false
});
$('#sun_start').on('change.datetimepicker', function (e) {
    $('#sun_end').datetimepicker('minDate', e.date);
    var sun1 = $('#sun_start').datetimepicker('viewDate');
    var sun2 = $('#sun_end').datetimepicker('viewDate');
    var sun3 = moment(sun2).diff(sun1);
    var sunH = moment.duration(sun3).as('hours');
    var sunM = Math.round((sunH - Math.floor(sunH)) * 60);
    sun_hours.innerHTML = Math.floor(sunH) + ":" + sunM;        
});
$('#sun_end').on('change.datetimepicker', function (e) { 
    $('#sun_start').datetimepicker('maxDate', e.date);
    var sun1 = $('#sun_start').datetimepicker('viewDate');
    var sun2 = $('#sun_end').datetimepicker('viewDate');
    var sun3 = moment(sun2).diff(sun1);
    var sunH = moment.duration(sun3).as('hours');
    var sunM = Math.round((sunH - Math.floor(sunH)) * 60);
    sun_hours.innerHTML = Math.floor(sunH) + ":" + sunM;
});
});

不确定它是否是最优雅的解决方案，但它适用于我的目的。如果有更好的方法，请告诉我。谢谢，特洛伊

于 2018-04-06T18:59:04.497 回答