BootstrapV3 datetimepicker 在下一个 prev 按钮单击时不会更改

Question

日历正在显示，但我必须在单击下一个和上一个按钮时更改日期，但它不起作用。

我正在使用 Bootstrap V3 和 datetimepicker 版本 4.15.35 https://github.com/Eonasdan/bootstrap-datetimepicker

这是代码：

//To display Calendar
$(document).ready(function() {
    $('#datetimepicker1').datetimepicker({
        format: "MM/DD/YYYY",
        defaultDate: new Date()
    });
});

//Next button added to Change date on next button click
$(function() {
    $('#next').click(function() {
        var date = $('#datetimepicker1').data("DateTimePicker").getDate(); // giving error
        date.setTime(date.getTime() + (1000 * 60 * 60 * 24))
        $('#datetimepicker1').datepicker("setDate", date);
    });
});

//Previous button added to Change date on prev button click
$(function() {
    $('#previous').click(function() {
        var date = $('#datetimepicker1').datetimepicker('getDate');
        date.setTime(date.getTime() - (1000 * 60 * 60 * 24))
        $('#datetimepicker1').datetimepicker("setDate", date);
    });
});

Answer 1

我建议您使用 moment

来操纵日期

查看 JSFiddle

上的工作示例

$('#datetimepicker1').datetimepicker({
    format: "MM/DD/YYYY",
    defaultDate: new Date()
});

//Next button added to Change date on next button click
$(function() {
    $('#next').click(function(event) {
        event.preventDefault();
        var date = $('#datetimepicker1').data("DateTimePicker").date();
        nextdate = moment(date).add(1, 'days');
        $('#datetimepicker1').data("DateTimePicker").date(nextdate);
    });
});

//Previous button added to Change date on prev button click
$(function() {
    $('#previous').click(function(event) {
        event.preventDefault();
        var date = $('#datetimepicker1').data("DateTimePicker").date();
        predate = moment(date).subtract(1, 'days');
        $('#datetimepicker1').data("DateTimePicker").date(predate);
    });
});

BootstrapV3 datetimepicker 在下一个 prev 按钮单击时不会更改

BootstrapV3 datetimepicker not changing on next prev button click

bootstrap-datetimepicker

eonasdan-datetimepicker