jQuery-UI的日期选择器的默认日期范围

Question

我正在使用jQuery-UI创建日期范围字段。 我想做的是将StartDate默认为今天的日期减去7天，将EndDate默认为“今天”的日期。 如果用户想更改日期，仍然允许更改日期。 以及不允许用户选择将来的日期（今天的日期之后）。 jQuery-UI的datepicker是否可以全部实现？

<script>
  $( function() {
    var dateFormat = "mm/dd/yy",
      from = $( "#StartDate" )
        .datepicker({
          defaultDate: "+1w",
          changeMonth: true,
          numberOfMonths: 1
        })
        .on( "change", function() {
          to.datepicker( "option", "minDate", getDate( this ) );
        }),
      to = $( "#EndDate" ).datepicker({
        defaultDate: "+1w",
        changeMonth: true,
        numberOfMonths: 1
      })
      .on( "change", function() {
        from.datepicker( "option", "maxDate", getDate( this ) );
      });

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

      return date;
    }
  } );
  </script>

<span class="srch_title" for="StartDate">From</span>
<input type='text' name="StartDate" id="StartDate" value="" required/>

<span class="srch_title" for="EndDate">To</span>
<input type='text' name="EndDate" id="EndDate" value="" required/>

https://jsfiddle.net/bobrierton/fdLy2n12/

任何帮助将不胜感激！

Answer 1

如果我正确理解标准，则以下应做预期的工作

$(function() {
  var today = new Date(),
    weekAgo = new Date(),
    $from = $("#StartDate"),
    $to = $("#EndDate");

  weekAgo.setDate(today.getDate() - 7);

  $from.datepicker({   
    maxDate: today,
    onSelect: function(dateText) {
      $to.datepicker("option", "minDate", dateText);
    }
  }).datepicker('setDate', weekAgo);

  $to.datepicker({
    maxDate: today,
    minDate: weekAgo,
    onSelect: function(dateText) {
      $from.datepicker("option", "maxDate", dateText);
    }
  }).datepicker('setDate', today);

});

不知道from需要一个minDate

演示