Question

我认为通过单击按钮显示具有不同参数的日历视图eventLimit，因为页面上有许多事件是添加或修改的用户，但未保存到服务器。用户需要切换到事件限制的不同视图，该视图位于this jsfiddle

Answer 1

要在已呈现日历时更改选项，您需要先破坏日历，更改选项，然后再次构建日历。你可以这样做：

var options = $('.calendar').fullCalendar('getView').options;
options.eventLimit = false;
$('.calendar').fullCalendar('destroy');
$('.calendar').fullCalendar(options);

jsfiddle

Answer 2

现在可以动态更改选项。

您不必销毁日历。

语法为calendar.setOption('eventLimit',false)来设置限制，calendar.getOption('eventLimit')来查看它是什么。

我想要一个按钮来扩展/折叠按钮单击时的所有事件，所以我制作了一个自定义按钮，如下所示：

calendar = new FullCalendar.Calendar($("#calendar"), {
    plugins: [ 'dayGrid', 'interaction', 'timeGrid', 'list' ],
    height: 700,
    displayEventEnd: true,
    customButtons: {
        eventLimitButton: {
            text: 'Expand/Collapse All',
            click: function() {
                if(!calendar.getOption('eventLimit'))
                    calendar.setOption('eventLimit',5); //I set the limit to 5
                else
                    calendar.setOption('eventLimit',false);
            }
        }
    },
    header: {
        left: 'prev,next today eventLimitButton',
        center: 'title',
        right: 'dayGridMonth,timeGridWeek,timeGridDay,listWeek'
    },
    buttonText: {
        today: "Today",
        dayGridMonth: "Month",
        timeGridWeek: "Week",
        timeGridDay: "Day",
        listWeek: "Weekly List"
    },
    //...

如何在不刷新页面的情况下更改eventLimit以显示不同eventLimit的效果

2 个答案:

jsfiddle