更改开始时间时自动设置结束时间答案

【问题标题】：Automatically set end time when start time is changed更改开始时间时自动设置结束时间
【发布时间】：2022-10-19 14:45:54
【问题描述】：

我正在使用daterangepicker 选择约会的开始时间和结束时间。目前，当开始时间改变时，结束时间变得相同。

一旦开始时间改变，我希望结束时间自动增加一个小时。

这是我的代码

$(function () {
    $('input[name="appt_time"]').daterangepicker({
        timePicker: true,
        timePicker24Hour: true,
        timePickerIncrement: 5,
        timePickerSeconds: false,
        locale: {
            format: 'HH:mm'
        }
    }).on('show.daterangepicker', function (ev, picker) {
        picker.container.find(".calendar-table").hide();
    });
})

【问题讨论】：

标签： jquery daterangepicker

【解决方案1】：

很晚而且不是那么优雅，但是由于 Daterangepicker 的选项有限，我构建了这个解决方案：

$('.calendar.left').on('change', function(ev) {
    // Checks if left hour select (startDate) was changed
    if(ev.target.className === 'hourselect') {
        // Increases endDate by 1 hour
        $('input[name="appt_time"]').data('daterangepicker').setEndDate(moment($('input[name="appt_time"]').data('daterangepicker').startDate).add(1, 'hours'))
        // Updates view and select
        $('input[name="appt_time"]').data('daterangepicker').updateView()
        $($('.hourselect')[1]).val($('input[name="appt_time"]').data('daterangepicker').endDate.format('HH'))
    }
});

【讨论】：