fullCalendar月视图 每次到本月时自动定位到当天所在行
时间: 2023-08-16 15:08:39 浏览: 132
fullCalendar 增加年视图版
5星 · 资源好评率100%
您可以使用fullCalendar的`gotoDate`方法来实现该功能。在月视图中,可以使用`dayGrid`插件来获取当前月份的所有日期元素,然后再使用`scrollIntoView`方法将当天所在行滚动到可见区域。
以下是示例代码:
```javascript
// 获取当前月份的所有日期元素
var dateEls = calendarRef.view.dayGrid.el.querySelectorAll('.fc-day');
// 找到当天所在的日期元素
var today = new Date();
var todayEl = null;
for (var i = 0; i < dateEls.length; i++) {
if (dateEls[i].getAttribute('data-date') === today.toISOString().slice(0, 10)) {
todayEl = dateEls[i];
break;
}
}
// 如果找到了当天所在的日期元素,则将其滚动到可见区域
if (todayEl) {
todayEl.scrollIntoView();
}
// 使用gotoDate方法切换到当前月份
calendarRef.gotoDate(new Date());
```
请注意,上述代码中的`calendarRef`是指向fullCalendar实例的引用,您需要在适当的位置将其设置为正确的值。
阅读全文