Question

实际上，我使用以下代码将假期设置为红色：

dayRender: function (dayRenderInfo) {

            var date = dayRenderInfo.date;

            var datestring = date.getFullYear() + "-" + ("0"+(date.getMonth()+1)).slice(-2) + "-" + ("0" + date.getDate()).slice(-2);

            var cell = dayRenderInfo.el;



            var array_holidays = []

            $.ajax({
                type: "POST",
                async: false,
                dataType:"json",
                url: "ajax/get-holidays.php",
                data: { "anno" : date.getFullYear() },

                success: function(data, status) {

                    array_holidays = data;

                }
            });

            $.each( array_holidays , function( key, value ) {

              if ( datestring == value) {

                $(cell).css("background-color", "red");

              }

            });


        },

我需要一个脚本，使某些假期（例如复活节）每年更改一次。因此，get-holidays.php，根据日历中实际显示的年份为我提供一系列假期。

它很好用，但由于性能原因不是很好，在月视图下，dayRender被调用了30-31次！

有人建议获得更好的性能吗？

Answer 1

对此要求的更好的整体解决方案是为这些假期创建一个单独的event source，其所有事件均设置了rendering: "background"选项。此选项将使事件在其涵盖的时间段的背景中简单地着色，而不是以常规方式显示为加粗的，带有标签的事件。您当然也可以通过事件的属性来控制颜色。

有关后台事件的详细信息，请参见https://fullcalendar.io/docs/background-events。还有一个演示here。

假期全日历更改背景颜色

1 个答案: