Question

我已经设法对我的日历事件进行jquery过滤。但经过不过滤后，事件将失去我为他们定义的颜色。知道怎么改变吗？谢谢！

    $(document).ready(function() {
            $('#calendar').fullCalendar({
                defaultView: 'month',
                prev: 'left-double-arrow',
                next: 'right-double-arrow', 
                height: 650, 
                aspectRatio: 2,
                 eventSources: [
                    {   
                        googleCalendarApiKey: GAPI,
                        googleCalendarId: googleCalendarId1,
                        color: '#f25d1d',    
                        textColor: 'white' 
                    }
                ], // To prevent click access to G Calendar
                eventRender: function(event, element) {
                    element.on('click', function (e) {
                        e.preventDefault();
                    });
                },
                 header: {
                    left: '',
                    center:'prev title next',
                    right: 'month,listMonth,'
                }                     
            });

            $("#checkbox1").change(function() {
                if(this.checked) {
                  $('#calendar').fullCalendar( 'addEventSource',  googleCalendarId1 );
                }
                else{
                $('#calendar').fullCalendar( 'removeEventSource',  googleCalendarId1 );
                }
            });
 });

Answer 1

您问题中的代码根本不起作用 - 只需添加日历ID，因为事件源将导致fullCalendar请求该URL，并返回404。该谷歌日历中的事件将不会重新添加到日历中。除了您描述的有关颜色的问题之外，这不是。

无论如何，你肯定也会丢失颜色信息。当您删除事件源时，它会丢失，当您重新添加事件源时（即使您正在执行的操作会起作用），您也不会重新提供包括颜色设置在内的配置信息。 / p>

显而易见的解决方案是将事件源配置保持为变量中的单独对象，然后每次添加和删除该变量。这将保持颜色设置，并实际上使上面的代码正确地重新添加事件源。

 var calendar1Source = {
    id: 1,
    googleCalendarApiKey: "SomeAPIKey",
    googleCalendarId: "SomeCalendarID",
    color: '#f25d1d',
    textColor: 'white'
  };

  $('#calendar').fullCalendar({
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
    },
    defaultView: 'month',
    eventSources: [calendar1Source],
    // To prevent click access to G Calendar
    eventRender: function(event, element) {
      element.on('click', function(e) {
        e.preventDefault();
      });
    }
  });

  $("#checkbox1").change(function() {
    if (this.checked) {
      $('#calendar').fullCalendar('addEventSource', calendar1Source);
    } else {
      $('#calendar').fullCalendar('removeEventSource', calendar1Source);
    }
  });

使用我碰巧知道的公共日历，查看此示例的工作演示：http://jsfiddle.net/sbxpv25p/208/

事件过滤后，Fullcalendar事件丢失了颜色

1 个答案: