Question

我有两个输入字段，一个用于到达，另一个用于出发。当用户输入arrivalDate时，我打开具有必要约束的departureDate datepicker。

但是当我打开第二个日期选择器时，以编程方式切换到下个月需要两次点击并再次触发show事件（？）。但是，选择当月的日期可以按预期工作。

这是一个显示问题的小提琴：http://jsfiddle.net/rrPAy/3/

HTML：

<form>
   <label for="arrivalDate">Arrival</label>
   <input type="text" name="arrivalDate" id="arrivalDate" autocomplete="off">
   <br>
   <label for="departureDate">Departure</label>
   <input type="text" name="departureDate" id="departureDate" autocomplete="off">
</form>

JAVASCRIPT：

$("#arrivalDate,#departureDate").datepicker({
    minDate: +1,
    firstDay: 1,
    dateFormat: "dd.mm.yy",
    showOn: 'both',
    gotoCurrent: true,
    buttonImageOnly: true,
    buttonText: 'Date',
    numberOfMonths: 1,
    inline: true,
    changeMonth: true,
    changeYear: true,
    beforeShow: function customRange(input)
    {
        if (input.id == 'departureDate') {
            var arrivalDate = jQuery('#arrivalDate').datepicker("getDate");
            if(arrivalDate) {
                arrivalDate.setDate(arrivalDate.getDate()+1); // Add 1 Day for Departure Date
                return {minDate: arrivalDate};
            }
        }
    },
    onClose: function() {
        if ($(this).attr('id') == 'arrivalDate') {
            $("#departureDate").datepicker("show");
            $("#departureDate").focus();
        }
    }
});

Answer 1

试试这个：

$("#arrivalDate,#departureDate").datepicker({
        minDate: +1,
        firstDay: 1,
        dateFormat: "dd.mm.yy",
        showOn: 'both',
        gotoCurrent: true,
        buttonImageOnly: true,
        buttonText: 'Date',
        numberOfMonths: 1,
        inline: true,
        changeMonth: true,
        changeYear: true,
        onSelect: function(dateText, inst) {
            if ($(this).attr('id') == 'arrivalDate') {
                var d =  $('#arrivalDate').datepicker('getDate');
                d.setDate(d.getDate()+1);
                $('#departureDate').datepicker('option', 'minDate', d);
                $('#departureDate').datepicker('show');
                inst.preventDefault();
            }
        }
    });

请参阅fiddle

Answer 2

我用这样的东西内部的onClose事件

setTimeout(function () {
    $('.datepicker').datepicker("show");
}, 50);

jQuery UI Datepicker月更改需要2次点击

2 个答案: