具有突出显示和选择回调的datepicker范围选择

时间:2012-12-31 09:15:39

标签: jquery jquery-ui jquery-ui-datepicker

我正在使用jQuery UI来显示2个月的内联日期选择器,我想启用从一天到另一天的范围选择,并在其间突出显示并“捕捉” 从一天到一天的日期会有一些回调,所以我可以将它们插入到一些输入中。

这是我目前的代码:

HTML:

 <div id="journey-calendar"></div>

脚本:

    $('#journey-calendar').datepicker({
        numberOfMonths: [2, 1],
        showOtherMonths: true,
        altField: '.begin-trip-date',
        altFormat: 'dd M yy', defaultDate: null
    });

感谢任何帮助或演示!

1 个答案:

答案 0 :(得分:0)

我做了类似的事情。我有2个日期选择器,一个用于开始日期,一个用于结束日期。我添加了一个css类来为范围中的日期设置背景颜色。这是我的代码:

},
beforeShowDay: function(date) {
  var fromDate = new Date($(".lblDateFrom").text());
  var toDate = new Date($(".lblDateTo").text());     

  if (date >= fromDate && date <= toDate) {
    return [true, 'ui-individual-date', ''];
  }
  else {
    return [true, '', ''];
 }
},

//css class
.ui-individual-date {
background-color: #F2F5F7;
}