jQuery UI Datepicker Rangeselect

Question

我从他们的文档中了解到,能够使用单个输入字段进行范围选择.

怎么能实现这一目标？我已经尝试了jQuery UI 1.6中建议的代码- jQuery的用户界面库,但它似乎不起作用.这是我正在尝试的代码:

$(function(){     
       //create config object
       var pickerOpts = {
         rangeSelect: true,
         rangeSeparator: " to "
      };     
        //create the date picker
        $("#date").datepicker(pickerOpts); 
      });

会发生什么,它只是选择一个日期,不允许范围选择,我正在寻找.

Answer 1

以下是关于如何仅使用jquery ui和一个datepicker来解决它的想法.

    $("#date").datepicker({
    numberOfMonths: 2,
    onSelect: function( selectedDate ) {
        if(!$(this).data().datepicker.first){
            $(this).data().datepicker.inline = true
            $(this).data().datepicker.first = selectedDate;
        }else{
            if(selectedDate > $(this).data().datepicker.first){
                $(this).val($(this).data().datepicker.first+" - "+selectedDate);
            }else{
                $(this).val(selectedDate+" - "+$(this).data().datepicker.first);
            }
            $(this).data().datepicker.inline = false;
        }
    },
    onClose:function(){
        delete $(this).data().datepicker.first;
        $(this).data().datepicker.inline = false;
    }
})

这是一个小提琴:http://jsfiddle.net/Z3FrL/3/

Answer 2

正如之前的海报所说,rangeSelect选项已被淘汰.但是,其源自RangeSelect选项JQuery的日历小部件仍然可用:

http://keith-wood.name/datepick.html#range