jQuery ui 时间选择器插件 - 范围问题

Question

最近我在使用 jQuery timepicker 插件。
我按照示例创建时间选择器
（下面link，第4个例子）
http://trentrichardson.com/examples/timepicker/#range_examples

我创建了一个日期范围选择器，就像这样

var startDateTextBox = $('#date_start');
var endDateTextBox = $('#date_end');

$.timepicker.dateRange(
    startDateTextBox,
    endDateTextBox,
    {
        dateFormat: "yy-mm-dd",
        minInterval: 0, 
        maxInterval: 0, 
        start: {}, // start picker options
        end: {} // end picker options
    }
);

但是，对于开始日期，当前可以选择日期 <= 结束日期。
希望开始日期可以选择"any date"
就像这个 http://jqueryui.com/datepicker/#date-range

中的例子

任何人都可以教我如何使用这个时间选择器插件实现这一点吗？谢谢

Answer 1

这里 .on('change',function(){ }) 设置 minDate 和 maxDate 作为开始和结束日期。使用这个 fiddle

JS:

var startDateTextBox = $('#date_start');
var endDateTextBox = $('#date_end');

$( function() {
    var dateFormat = "yy-mm-dd",
      from = startDateTextBox.datepicker({
          defaultDate: "+1w",
          changeMonth: true,
          numberOfMonths: 3,
          dateFormat:'yy-mm-dd'
        })
        .on( "change", function() {
          to.datepicker( "option", "minDate", getDate( this ) );
        }),
      to = endDateTextBox.datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 3,
        dateFormat:'yy-mm-dd'
      })
      .on( "change", function() {
        from.datepicker( "option", "maxDate", getDate( this ) );
      });


    function getDate( element ) {
      var date;
      try {
        date = $.datepicker.parseDate( dateFormat, element.value );
        alert(date);
      } catch( error ) {
        date = null;
      }
      return date;
    }
  });

HTML:

<input id="date_start"/>
<input id="date_end"/>

jQuery ui 时间选择器插件 - 范围问题

jQuery ui timepicker add-on - range issue

jquery

datepicker

timepicker

add-on

daterangepicker