如何約束基於另一日期的jQuery-ui datepicker的最小和最大日期

Question

我想知道我們如何設置簽入日期之間的退房日期。就像我們選擇六月份（當月份是二月）和第十五天一樣。因此它賦予權限選擇30天之間的日期（30次限制）。所以結束日期是：7月15日。在這裏，我們有一個代碼：

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/themes/black-tie/jquery-ui.css" media="screen" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.2/jquery-ui.min.js"></script> 
<style type="text/css"> 
body{ font: 60.0% "Trebuchet MS", sans-serif; margin: 50px; } 
</style> 
<script type="text/javascript"> 
    $(function() { 
     $('#from').datepicker({ 
      numberOfMonths: 2, 
      firstDay: 1, 
      dateFormat: 'DD dd-mm-yy', 
      minDate: '0', 
      maxDate: '+2Y', 
      onSelect: function(dateStr) { 
       var min = $(this).datepicker('getDate'); 
       $('#to').datepicker('option', 'minDate', min || '0'); 
       datepicked(); 
      } 
     }); 
     $('#to').datepicker({ 
      numberOfMonths: 2, 
      firstDay: 1, 
      dateFormat: 'DD dd-mm-yy', 
      minDate: '0', 
      maxDate: '+2Y', 
      onSelect: function(dateStr) { 
       var max = $(this).datepicker('getDate'); 
       $('#from').datepicker('option', 'maxDate', max || '+2Y'); 
       datepicked(); 
      } 
     }); 
    }); 
    var datepicked = function() { 
     var from = $('#from'); 
     var to = $('#to'); 
     var nights = $('#nights'); 
     var fromDate = from.datepicker('getDate') 
     var toDate = to.datepicker('getDate') 
     if (toDate && fromDate) { 
      var difference = 0; 
      var oneDay = 1000 * 60 * 60 * 24; 
      var difference = Math.ceil((toDate.getTime() - fromDate.getTime())/oneDay); 
      nights.val(difference); 
     } 
    } 
</script> 
<input type="text" id="from" name="from" size="28" style="width:194px; /*Tag Style*/" value="" > 
<input type="text" id="to" name="to" size="28" style="width:194px; /*Tag Style*/" value="" > 
<input type="text" id="nights" name="nights" size="4" style="width:50px; /*Tag Style*/" value="" readonly="readonly"> 

我們的主要動機是做這個代碼，用於登記入住，退房和晚上。其中入住日期可以是2012-2013年的任何月份，退房日期只是30天后的入住日期，而總晚上只有30晚。

Answer 1

看一看this demo。我已經添加了一些線在onSelect事件，像這樣：

onSelect: function(dateStr) { 
     var d1 = $(this).datepicker("getDate"); 
     d1.setDate(d1.getDate() + 0); // change to + 1 if necessary 
     var d2 = $(this).datepicker("getDate"); 
     d2.setDate(d2.getDate() + 30); // change to + 29 if necessary 
     $("#to").datepicker("setDate", null); 
     $("#to").datepicker("option", "minDate", d1); 
     $("#to").datepicker("option", "maxDate", d2); 
     datepicked(); 
    } 

根據我的住宿業務的瞭解，日期應該是包容性 - 即六月/二千〇十二分之十五+ 30晚應在6月/ 14/2012。但我已經按照你在前幾行提到的例子。