jquery - 全日历议程日滚动到第一个事件

Question

我正在使用fullcalendar v2.4，我知道选项scrollTime可用于滚动以使agendaDay滚动到某个时间，如下所示:

$('#calendarday').fullCalendar({
    header: {
  },
   weekends: true, //  show Saturdays and Sundays
   defaultView: 'agendaDay',
   events: entries, 
   scrollTime: "15:00:00",
});

现在我想滚动到当天的第一个事件:这意味着我使用 jquery 动态获取议程日中第一个事件的开始时间:

var firstEventTime = $("div.fc-time:first> span:nth-child(1)").text() + ":00";

这会找到第一个 div“fc-time”，然后选择内部跨度中的开始时间(格式为 H:mm )。

但是将firstEventTime放入滚动中不起作用

$('#calendarday').fullCalendar({
    header: {
  },
   weekends: true, //  show Saturdays and Sundays
   defaultView: 'agendaDay',
   events: entries, 
   scrollTime: firstEventTime,
 });

这可能吗？

Answer 1

通过使用 eventAfterAllRender 选项，我能够滚动到agendaDay View 中一天的第一个事件。

请注意，这是查看插件生成的内部元素，因此如果作者在下一版本中更改它们，则可能需要更新此方法。

我还走了一条捷径，使用了 Ariel Flesler 的 jQuery scrollTo 插件，因为我已经在使用它了。如果您愿意，您可以使用自己的 javascript 获得相同的结果。

jQuery scrollTo插件网址

eventAfterAllRender: function(view){
    if('agendaDay'===view.name){
            if($('.fc-time-grid-event').length>0){
                var renderedEvents = $('div.fc-event-container a');
                var firstEventOffsetTop = renderedEvents&&renderedEvents.length>0?renderedEvents[0].offsetTop:0;
                $('div.fc-scroller').scrollTo(firstEventOffsetTop+'px');
            }
        }            
    },