jQuery UI Datepicker-onSelect获取所选日期+3天 [英] jQuery UI Datepicker - onSelect get the selected date +3 days

问题描述

我尝试通过使用jQuery UI datepicker(使用两个文本字段)来创建日期范围.第一个文本字段"start_date"将设置开始日期，第二个文本字段"end_date"将设置结束日期.

I try to create a date range by using the jQuery UI datepicker, using two text fields. The first text field "start_date" will set the start date and the second text field "end_date" will set the end date.

到目前为止，我的代码是:

The code I have till now is this:

$('#start_date').live(
    'focus',
    function()
    {
        $('#end_date').datepicker(
            {
                dateFormat: 'dd MM yy',
                minDate: new Date(),
                maxDate: new Date(2012, 9, 15),
                stepMonths: 2,
                numberOfMonths: 2
            }
        );

        $(this).datepicker(
            {
                dateFormat: 'dd MM yy',
                minDate: new Date(),
                maxDate: new Date(2012, 9, 15),
                stepMonths: 2,
                numberOfMonths: 2,
                onSelect: function(dateText, inst)
                {
                    var instance = $( this ).data("datepicker");

                    var date = $.datepicker.parseDate(instance.settings.dateFormat, dateText, instance.settings);

                    $('#end_date').datepicker('option', 'minDate', dateText);
                }
            }
        );
    }
);

注意:我使用实时事件和焦点事件，因为我的所有页面内容都已通过AJAX调用加载.也许是对还是错，但这不是我想在这里问的;)

NOTE : I use the live and the focus event because all my page content is loaded with AJAX call. Maybe that is correct or wrong, but this is not what I like to ask here ;)

上面的代码对我来说是正确的并且可以正常工作，但是我想做的是将'end_date'元素的值设置为选择的+3天.

The above code is correct for me and work fine, but what I like to do, is to set the value of the 'end_date' element to selected one +3 days.

直到现在，当我在"start_date"元素中选择一个日期时，"end_date"元素将更改为与"start_date"相同的日期，这就是我要更改的内容.选择后，结束日期"应比开始日期"元素晚+3天.

Until now, when I choose a date at the "start_date" element the "end_date" element change to the same date as the "start_date", and this is what I like to change. The "end_date" to be +3 days from the "start_date" element adter the selection.

我该怎么做?

推荐答案

要将结束日期设置为+1天

To set end_date for +1 day

onSelect: function(dateText, inst) {
    $('#start_date').datepicker('option','minDate', new Date(inst.selectedYear, inst.selectedMonth, inst.selectedDay));
    var toDate = new Date(inst.selectedYear, inst.selectedMonth, inst.selectedDay);//Date one month after selected date
    var oneDay = new Date(toDate.getTime()[phone]);
    document.getElementById('end_date').value =$.datepicker.formatDate('dd/mm/yy', oneDay);
}

这篇关于jQuery UI Datepicker-onSelect获取所选日期+3天的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！