Question

当选择from-date时，我希望to-date可能 3-7天。所以from-to应该是min 3 days和max 7 days。我怎么能这样做？

 $(function() {
  $.datepicker.setDefaults({minDate: 0, changeMonth: true, numberOfMonths: 1});
  $('#datepicker').datepicker({onSelect: function(selectedDate) {
        $('#datepicker').datepicker('option', 'minDate', selectedDate);
        setTimeout(function() { $('#datepicker1').focus(); }, 0);
  }});
  $('#datepicker1').datepicker({onSelect: function(selectedDate) {
        $('#datepicker1').datepicker('option', 'maxDate', selectedDate);
  }});
});

Answer 1

from-to应该是最少3天，最多7天

在第一个日期选择器中选择日期时，您需要设置其他日期选择器的minDate和maxDate。正如你已经正确地想到需要在onSelect事件处理程序中完成的那样。

但请注意，传递给onSelect的参数是字符串。因此，如果您只是使用getDate提取日期并使用它来定义3到7天的范围，那将会更好更容易。

以下是一个例子：

$("#fromDate").datepicker({ 
    dateFormat: "yy-mm-dd", 
    onSelect: function() {

        // define a range object
        var dateRange = {min:null, max:null}, 

        // get the selected date from the first datepicker
            selectedDate = $('#fromDate').datepicker('getDate');

        dateRange.min = selectedDate.getDate() + 3; // add 3 days for min
        dateRange.max = selectedDate.getDate() + 7; // add 7 days for max

        // assign min and max to minDate and maxDate of second datepicker
        $('#toDate').datepicker('option', 'minDate', dateRange.min);
        $('#toDate').datepicker('option', 'maxDate', dateRange.max);

        // set the focus to the second datepicker
        setTimeout(function() { $('#toDate').focus(); }, 0);
    }
});

小提琴：http://jsfiddle.net/abhitalks/ryhkkap3/

<强>段：

＆＃13;

$("#fromDate").datepicker({ 
    dateFormat: "yy-mm-dd", 
    onSelect: function() {
        var dateRange = {min:null, max:null},
        	selectedDate = $('#fromDate').datepicker('getDate');
        dateRange.min = selectedDate.getDate() + 3;
        dateRange.max = selectedDate.getDate() + 7;
        $('#toDate').datepicker('option', 'minDate', dateRange.min);
        $('#toDate').datepicker('option', 'maxDate', dateRange.max);
        setTimeout(function() { $('#toDate').focus(); }, 0);
    }
});
$("#toDate").datepicker({ dateFormat: "yy-mm-dd" });

＆＃13;

<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<input id="fromDate" />
<input id="toDate" />

＆＃13;

Answer 2

你可以做这样简单的事情：

$('#datepicker').datepicker({onSelect: function(selectedDate) {
      var newToDateStart=new Date(selectedDate);//convert selectedDate to Date object
      newToDateStart.setDate(newToDateStart.getDate()+3) //todate start
      var newToDateEnd=new Date(selectedDate);
      newToDateEnd.setDate(newToDateEnd.getDate()+7);//todate end
      $('#datepicker1').datepicker('option', 'minDate', newToDateStart);
      $('#datepicker1').datepicker('option', 'maxDate', newToDateEnd);
      //set min and maxdate to datepicker1
      setTimeout(function() { $('#datepicker1').focus(); }, 0);
}});

<强> DEMO HERE

jQuery Datapicker限制从

2 个答案: