fullcalendar：有没有办法仅在我通过事件函数加载事件后调用 dayRender

我正在构建的网络应用程序中使用 fullcalendar。

我加载我的事件事件函数和阿贾克斯。

这是我的代码：

var ajaxData;
var eventsJsonArray;
var json_backgrundColor;
var json_iconstring;

//alert('Hello! 1!');
$(document).ready(function () {

    $('#calendar').fullCalendar({
        header: {
            left: 'prev',
            center: 'title',
            right: 'next,month,agendaWeek,agendaDay'
        },
        //custom events function to be called every time the view changes
        events: function (start, end, timezone, callback) {
            var mStart = start.format('M')
            var yStart = start.format('YYYY')
            $.ajax({
                url: '$getMonthDataUrl',
                type: 'GET',
                data: {
                    startDate: start.format(),
                    endDate: end.format()
                },
                error: function () {
                    alert('there was an error while fetching events!');
                },
                success: function (data) {
                    alert('nice!!');
                    ajaxData = data;
                    json_iconstring = ajaxData['iconString'];
                    json_backgrundColor = ajaxData['Calendar_cell_background_color'];
                    eventsJsonArray = ajaxData['all_Events_For_The_Month'];
                    callback(eventsJsonArray); //pass the event data to fullCalendar via the supplied callback function
                }
            });
        },
        fixedWeekCount: false,
        showNonCurrentDates: false,

        dayRender: function (date, cell, view) {
            console.log(json_backgrundColor);//this brings eror because json_backgrundColor is undefined 
            var cellDate = date.format('D');
            if (date.format('M') == view.start.format('M')) //cheacking is this day is part of the currrent month (and not prev/next month)
            {
                alert(cellDate);
                cell.css('background-color', json_backgrundColor[cellDate]);//this brings eror because json_backgrundColor is undefined 

            }


        },
    })

});

当我通过 ajax 加载事件时，我还获得有关每个单元格应该获得哪种背景颜色的信息。我只能通过事件 ajax 请求获取此信息。

问题是当 dayRender 运行时，我仍然没有背景颜色数据。 （json_backgrundColor 未定义）。

有没有办法让 dayRender 在事件日历停止运行后运行？或任何其他可以解决我的问题的代码。

非常感谢！！

您的问题是，“dayRender”回调在视图更改后运行（为此目的，使用上一个/下一个更改日期算作更改视图），但在下载和呈现新视图的事件之前运行。这就是为什么你的json_backgrundColor数组未定义。

由于您提到要使用的颜色取决于当前安排在该特定日期的事件的确切性质，因此我们需要找到可以在所有事件和颜色数据下载后运行的东西。

检查 HTML，我们可以看到用于绘制每天的表格单元格都应用了 CSS 类“fc-day”。他们还有一个data-date包含与其相关的日期的属性。最后，禁用的日期（在主月之外，由于您的设置）showNonCurrentDates:false）应用了额外的“fc-disabled-day”类别。我们可以使用这些信息来识别我们想要更改的单元格，而不必使用dayRender打回来。

The eventAfterAllRender当所有事件都已呈现时，回调将运行一次。因此，这似乎是更改单元格背景颜色的好地方：

eventAfterAllRender(function(view) {
    //loop through each non-disabled day cell
    $('.fc-day:not(.fc-disabled-day)').each(function(index, element) {
      //set the background colour of the cell from the json_backgroundColor arrray, based on the day number taken from the cell's "data-date" attribute.
      $(this).css('background-color', json_backgroundColor[moment($(this).data("date")).format("D")]);
    });
}

注意我已经重命名了json_backgrundColor to json_backgroundColor纠正拼写错误。

注意：这是脆弱的，因为它依赖于 fullCalendar 在内部使用来表示日期单元格的类名。如果 fullCalendar 决定在未来版本中以不同的方式执行此操作，它将中断（而如果我们能够通过指定的回调使用 fullCalendar API，则尽管发生内部更改，它们可能仍会保持一致性，或者至少记录任何更改）。但这对于“月”视图非常关键，因此实际上它不太可能很快发生变化 - 如果您更新完整的日历版本，您只需要记住测试它即可。