fullcalendar限制显示在一天的事件数。

最新推荐文章于 2025-07-04 11:01:54 发布

原创最新推荐文章于 2025-07-04 11:01:54 发布 · 3.8k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #ViewUI

fullcalendar 专栏收录该内容

1 篇文章

订阅专栏

本文深入探讨了EventLimit配置项在日历视图中的作用，包括其布尔值、整数值的含义及如何通过View-SpecificOptions进行自定义设置。详细解释了EventLimit如何限制显示事件的数量，并在事件过多时启用'更多'链接，以及如何根据不同视图调整该参数以优化用户体验。

部署运行你感兴趣的模型镜像

eventLimit 2.1.0

Limits the number of events displayed on a day.

Boolean, Integer. default: false

When there are too many events, a link that looks like "+2 more" is displayed. The exact action that happens when the user clicks the link is determined by eventLimitClick.

A value of false (the default) will display all events as-is.

A value of true will limit the number of events to the height of the day cell.

An integer value will limit the events to a specific number of rows.

For the all-day section in the agenda views, a value of true will limit the number of events to5. To fine-tune this, use View-Specific Options like this:

$('#calendar').fullCalendar({
    eventLimit: true, // for all non-agenda views
    views: {
        agenda: {
            eventLimit: 6 // adjust to 6 only for agendaWeek/agendaDay
        }
    }
});