fullCalendar月视图下,在每次切换到当月时自动定位到当天所在行
时间: 2024-02-24 13:55:12 浏览: 140
你可以使用fullCalendar提供的视图切换事件(viewRender)和dayRender事件来实现该功能。首先,在viewRender事件中获取当前月份所在的行,然后在dayRender事件中判断当前日期是否为当天,如果是,就将焦点定位到所在行。
以下是示例代码:
```javascript
$('#calendar').fullCalendar({
viewRender: function(view, element) {
// 获取当前月份所在的行
var currentMonth = view.intervalStart.format('YYYY-MM');
var $dayCells = $(element).find('.fc-day-top');
var $currentMonthCells = $dayCells.filter('[data-date^="' + currentMonth + '"]');
// 定位到当天所在行
if ($currentMonthCells.length > 0) {
var $todayCell = $currentMonthCells.filter('.fc-today');
if ($todayCell.length === 0) {
$todayCell = $currentMonthCells.eq(Math.floor($currentMonthCells.length / 2));
}
var scrollTop = $todayCell.offset().top - $(element).find('.fc-day-grid').offset().top;
$(element).find('.fc-scroller').scrollTop(scrollTop);
}
},
dayRender: function(date, cell) {
// 将焦点定位到当天所在行
if (date.isSame(moment(), 'day')) {
$(cell).attr('tabindex', 0).focus();
}
}
});
```
这段代码会在每次切换到月视图时触发viewRender事件,获取当前月份所在的行,然后根据当前日期是否为当天,在dayRender事件中将焦点定位到所在行。
阅读全文