选择开始和结束日期[JQuery的]

Question

我想提出一个bookingsystem，并希望能有一个大的日历（表），在一个小框右侧的一些信息。

在框中我想文本框：

• 签日期
• 结帐日期

我如何，最好用jQuery，做，所以当用户按压在一个日期大日历时，该日期的值将被转移到litte sidebox中的“Checkin date-field”，同时禁用之前的下一个选择日期。用户下次推送日期时，“结帐日期”会获取该值。

Answer 1

退房的jQuery UI的DatePicker的

http://jqueryui.com/demos/datepicker/#date-range

<script> 
$(function() { 
    var dates = $("#from, #to").datepicker({ 
     defaultDate: "+1w", 
     changeMonth: true, 
     numberOfMonths: 3, 
     onSelect: function(selectedDate) { 
      var option = this.id == "from" ? "minDate" : "maxDate", 
       instance = $(this).data("datepicker"); 
       date = $.datepicker.parseDate(
        instance.settings.dateFormat || 
        $.datepicker._defaults.dateFormat, 
        selectedDate, instance.settings); 
      dates.not(this).datepicker("option", option, date); 
     } 
    }); 
}); 
</script> 

<div class="demo"> 
    <label for="from">From</label> 
    <input type="text" id="from" name="from"/> 
    <label for="to">to</label> 
    <input type="text" id="to" name="to"/>  
</div>