Question

我想尝试在引导程序中找到两个datepickers之间的差异我尝试了下面的代码，但它没有给出任何输出我在第一个文本框中有三个文本框是当前时间秒是4小时除了当前时间在第三个文本框中我需要区别，即持续时间。

HTML

   <input type="text" id="datetimepicker-duration"  readonly> </input> 

 </div>

  <form role="form">
    <div class="form-group">
      <label for="comment">Comment:</label>
      <textarea class="form-control" rows="5" id="comment"></textarea>
    </div>
  </form>
</div>

JavaScript

var d = new Date();
var month = d.getMonth();
var day = d.getDate();
var year = d.getFullYear();
var hours = d.getHours();
var minutes = d.getMinutes();
$(function () {
    $('#startdatetime-from').datetimepicker({
        language: 'en',
        pick12HourFormat: 'true',
        startDate: new Date(),
        endDate:new Date(),
        format: 'HH:mm PP dd-MM-yyyy '
    });
    $("#startdatetime-from").data('datetimepicker').setLocalDate(new Date(year, month, day, hours, minutes));

    $('#startdatetime-from1').datetimepicker({
        language: 'en',
        pick12HourFormat: 'true',
        startDate : new Date(),
        format: 'HH:mm PP dd-MM-yyyy ' 
    });

    $("#startdatetime-from1").data('datetimepicker').setLocalDate(new Date(year, month, day, hours+4, minutes) );


    var d1 = $('#startdatetime-from').datepicker('getDate');
    var d2 = $('#startdatetime-from1').datepicker('getDate');
    var diff = 0;
      if (d1 && d2) {
            diff = Math.floor((d2.getTime() - d1.getTime()) / 86400000); // ms per day
      }
    $("#duration").data('diff').setLocalDate(new Date());

    });

感谢您的帮助。

Answer 1

请查看此Fiddle

我添加了以下代码

var d = new Date();
var month = d.getMonth();
var day = d.getDate();
var year = d.getFullYear();
var hours = d.getHours();
var minutes = d.getMinutes();
$(function () {
    $('#startdatetime-from').datetimepicker({
        language: 'en',
        pick12HourFormat: 'true',
        startDate: new Date(),
        endDate: new Date(),
        format: 'HH:mm PP dd-MM-yyyy ',

    });
    $("#startdatetime-from").data('datetimepicker').setLocalDate(new Date(year, month, day, hours, minutes));

    $('#startdatetime-from1').datetimepicker({
        language: 'en',
        pick12HourFormat: 'true',
        startDate: new Date(),
        format: 'HH:mm PP dd-MM-yyyy '
    }).on('changeDate', function (ev) {
        $("#datetimepicker-duration").val(getDt());
    });

    $("#startdatetime-from1").data('datetimepicker').setLocalDate(new Date(year, month, day, hours + 4, minutes));

    $('#duration').datetimepicker({
        language: 'en',
        pick12HourFormat: 'true',
        startDate: new Date(),
        format: 'HH:mm PP dd-MM-yyyy '
    });

    $("#duration").data('datetimepicker').setLocalDate(new Date(year, month, day, hours + 4, minutes));

    function getDt() {

        var d1 = $('#startdatetime-from').data('datetimepicker').getDate(); //"now"
        var d2 = $('#startdatetime-from1').data('datetimepicker').getDate(); // some date
        var diff = Math.abs(d2 - d1);
        diff = msToTime(diff);
        alert(diff);
        return diff;
    }

    function msToTime(duration) {

        var milliseconds = parseInt((duration % 1000) / 100);
        var seconds = (duration / 1000) | 0;
        duration -= seconds * 1000;

        var minutes = (seconds / 60) | 0;
        seconds -= minutes * 60;

        var hours = (minutes / 60) | 0;
        minutes -= hours * 60;

        var days = (hours / 24) | 0;
        hours -= days * 24;

        var weeks = (days / 7) | 0;
        days -= weeks * 7;
        return weeks+" Weeks "+days + " Days " + hours + ":" + minutes + ":" + seconds + "." + milliseconds;
    }
    debugger
    $("#datetimepicker-duration").val(getDt());
    $("#startdatetime-from1").data('datetimepicker').keypress(function (e) {
        alert();
        $("#datetimepicker-duration").val(getDt());
    });
    $("#startdatetime-from").data('datetimepicker').keypress(function (e) {
        alert();
        $("#datetimepicker-duration").val(getDt());
    });
});

引导程序中两个日期选择器的持续时间

1 个答案: