jQuery UI 日期选择器突出显示日期
jQuery UI datepicker highlighting dates
我曾尝试使用此 example 来突出显示日期,不幸的是我使用了不同版本的 jQuery 和 jQuery UI,但这不起作用。突出显示天数的月份不会显示。我该如何解决?
jQuery - v2.1.3
jQuery UI - v1.11.4
我的代码如下所示:
<div id="calendar"></div>
<script>
jQuery(document).ready(function() {
// An array of dates
var eventDates = {};
eventDates[ new Date( '07/07/2015' )] = new Date( '07/07/2015' );
// datepicker
jQuery('#calendar').datepicker({
beforeShowDay: function( date ) {
var highlight = eventDates[date];
if( highlight ) {
return [true, "event", highlight];
} else {
return [true, '', ''];
}
}
});
});
</script>
这是个好问题。我将 jquery 版本更改为 1.8.3
,将 jquery ui 更改为 1.9.2
,然后它就可以工作了。这是一个 example.
这部分代码可能会导致奇怪的行为:
var eventDates = {};
eventDates[ new Date( '07/07/2015' )] = new Date( '07/07/2015' );
在那种情况下,date 将使用他的 toString() 方法来 return 要使用的键,但是某些对象可以 return [object Object].
这就是为什么您应该始终使用字符串作为密钥的原因。此外,如您所见,您在地图数组中调用了两次相同的日期,这会使您的密钥在这种情况下无用,因为 key === value.
因此,也许您想使用带有 toISOString 的字符串数组:
var eventDates = [];
eventDates.push((new Date( '06/06/2015' )).toISOString(),
(new Date( '06/07/2015' )).toISOString()
);
然后你可以使用 indexOf 检查日期是否在你的数组中:
return (eventDates.indexOf(date.toISOString()) > -1) ? [true, "event"] : [true, ""];
这是 jsfiddle(感谢 depperm 提供的模板):
我曾尝试使用此 example 来突出显示日期,不幸的是我使用了不同版本的 jQuery 和 jQuery UI,但这不起作用。突出显示天数的月份不会显示。我该如何解决?
jQuery - v2.1.3
jQuery UI - v1.11.4
我的代码如下所示:
<div id="calendar"></div>
<script>
jQuery(document).ready(function() {
// An array of dates
var eventDates = {};
eventDates[ new Date( '07/07/2015' )] = new Date( '07/07/2015' );
// datepicker
jQuery('#calendar').datepicker({
beforeShowDay: function( date ) {
var highlight = eventDates[date];
if( highlight ) {
return [true, "event", highlight];
} else {
return [true, '', ''];
}
}
});
});
</script>
这是个好问题。我将 jquery 版本更改为 1.8.3
,将 jquery ui 更改为 1.9.2
,然后它就可以工作了。这是一个 example.
这部分代码可能会导致奇怪的行为:
var eventDates = {};
eventDates[ new Date( '07/07/2015' )] = new Date( '07/07/2015' );
在那种情况下,date 将使用他的 toString() 方法来 return 要使用的键,但是某些对象可以 return [object Object].
这就是为什么您应该始终使用字符串作为密钥的原因。此外,如您所见,您在地图数组中调用了两次相同的日期,这会使您的密钥在这种情况下无用,因为 key === value.
因此,也许您想使用带有 toISOString 的字符串数组:
var eventDates = [];
eventDates.push((new Date( '06/06/2015' )).toISOString(),
(new Date( '06/07/2015' )).toISOString()
);
然后你可以使用 indexOf 检查日期是否在你的数组中:
return (eventDates.indexOf(date.toISOString()) > -1) ? [true, "event"] : [true, ""];
这是 jsfiddle(感谢 depperm 提供的模板):