Question

通过对本网站的研究，我发现了一种使用2个日期选择器的方法。如果您在第一个上选择日期，则第二个将自动显示所选日期作为新的minDate。您可以在我的测试服务器上看到此操作：http://www.zinius.nl/trips

我在这种情况下遇到的问题：选择签入日期字段，但不要选择日期并单击其他位置。你不会能够再次备份签入日期字段的日期选择器弹出窗口，直到您刷新整个页面或首先选择签出日期。

这是我正在使用的代码：

$( "#datepicker1" ).datepicker({
showOn: 'both',
buttonImage: 'images/ico/calendar.png',
buttonImageOnly: true,
minDate: 0,
firstDay: 0,
dateFormat: 'mm-dd-yy',
changeMonth: false,
numberOfMonths: 1,
onClose: function( selectedDate ) {
    var minDate = $(this).datepicker('getDate');
    var newMin = new Date(minDate.setDate(minDate.getDate() + 1));
    $( "#datepicker2" ).datepicker( "option", "minDate", newMin );
    $( "#datepicker2" ).datepicker( "show" );
}
});
$( "#datepicker2" ).datepicker({

showOn: 'both',
buttonImage: 'images/ico/calendar.png',
buttonImageOnly: true,
minDate: '+1d',
changeMonth: false,
firstDay: 0,
dateFormat: 'mm-dd-yy',
numberOfMonths: 1,
onClose: function( selectedDate ) {
}
});

我尝试用onSelect替换onClose。这解决了这个问题，但是当我在datepicker1上选择一个日期时，datepicker2会出现并在闪存中消失。

有没有人有解决方案让这个工作正常？

谢谢你， Guilliano

Answer 1

尝试使用

更改第一个datePicker上的onClose函数

...,
onClose: function( selectedDate ) {
  var minDate = $(this).datepicker('getDate');
  if(minDate){
    var newMin = new Date(minDate.setDate(minDate.getDate() + 1));
    $( "#datepicker2" ).datepicker( "option", "minDate", newMin );
    $( "#datepicker2" ).datepicker( "show" );
  }
}

Answer 2

查看控制台，我可以看到记录此错误：

无法调用null的方法'getDate'

这意味着你的陈述：

var minDate = $(this).datepicker('getDate');

造成了这个问题。您可以做的是首先检查selectedDate（传递给onClose回调）是否有效，然后再尝试getDate。

onClose: function(selectedDate) {
    if (selectedDate) {
        ...
    }
}

datepicker onClose问题

2 个答案: