javascript - 日期选择器范围不允许结帐日期为同一天

Question

我试图在同一天办理入住和退房日期，但它不允许我这样做。请帮助我做到这一点。

var ajax_check_var = '';
$('.location_search_results_ul').hide();

$("#check_in_time").datepicker({
    showOtherMonths: true,
    dateFormat: 'dd-mm-yy',
    minDate: 0,
    //for calender Css
    beforeShowDay: function (date) {
        return highlightDateBorder($("#check_in_time").val(), date);
    },
    onSelect: function(selectedDate) {
        var date_format = selectedDate.split("-");
        var selectedDate = new Date($.datepicker.formatDate('yy-mm-dd', new Date(date_format[2], date_format[1] - 1, date_format[0])));
        selectedDate.setDate(selectedDate.getDate() + 1);
        $("#check_out_time").datepicker("option", "minDate", selectedDate);
    },
});

$("#check_out_time").datepicker({
    showOtherMonths: true,
    dateFormat: 'dd-mm-yy',
    //for calender Css
    beforeShowDay: function (date) {
        return highlightDateBorder($("#check_out_time").val(), date);
    },
    beforeShow: function (input, instance) {
        var date_to = $('#check_in_time').val();
        if (typeof date_to != 'undefined' && date_to != '') {
            var date_format = date_to.split("-");
            var selectedDate = new Date($.datepicker.formatDate('yy-mm-dd', new Date(date_format[2], date_format[1] - 1, date_format[0])));
            selectedDate.setDate(selectedDate.getDate()+1);
            $("#check_out_time").datepicker("option", "minDate", selectedDate);
        } else {
            var date_format = new Date();
            var selectedDate = new Date($.datepicker.formatDate('yy-mm-dd', new Date()));
            selectedDate.setDate(selectedDate.getDate()+1);
            $("#check_out_time").datepicker("option", "minDate", selectedDate);
        }
    }
});

标签： javascriptjqueryhtmlcssjquery-ui-datepicker

Answer 1

在您的代码中多次minDate将check_out_timedatepicker 设置为selectedDate. 但是selectedDate，由于以下行，从来都不是实际选择的日期，而是选择的日期 + 1。

selectedDate.setDate(selectedDate.getDate()+1)

更改应该允许您选择同一天。

我还建议清理所有重复的代码，你有很多重复几次的行为，这使得阅读变得一团糟:)你可以将三行移到一个函数中并调用它，而不是仅仅重复基本相同三个地方的逻辑。

const date_format = selectedDate.split("-");
setMinData(new Date(date_format[2], date_format[1] - 1, date_format[0]));

function setMinDate(date) {
    var selectedDate = new Date($.datepicker.formatDate('yy-mm-dd', date));
    selectedDate.setDate(selectedDate.getDate() + 1);
    $("#check_out_time").datepicker("option", "minDate", selectedDate);
}