Javascript 完整日历-Rails-向事件添加自定义CSS类

Javascript 完整日历-Rails-向事件添加自定义CSS类,javascript,ruby-on-rails,json,fullcalendar,Javascript,Ruby On Rails,Json,Fullcalendar,我在日历上显示约会。我希望为活动添加一个类,以便根据约会状态更改其背景颜色 <script> $(document).ready(function(){ var user_id = '<%= params[:id] %>'; var eventsPath = "/users/" + user_id + "/appointments.json"; $('#calendar').fullCalendar({ edit

我在日历上显示约会。我希望为活动添加一个类,以便根据约会状态更改其背景颜色

<script>  
  $(document).ready(function(){

    var user_id = '<%= params[:id] %>';
    var eventsPath = "/users/" + user_id + "/appointments.json";

      $('#calendar').fullCalendar({
          editable: false,
          handleWindowResize: true,
          displayEventEnd: false,
          firstDay: 1,
          allDaySlot: false,
          columnFormat: 'ddd',
          scrollTime: '12:00:00',
          eventBackgroundColor: '#505B75',
          eventBorderColor: '#505B75',
          header: {
              left: 'prev,next today',
              center: 'title',
              right: 'month,agendaWeek,agendaDay'
          },
          defaultView: 'agendaWeek',
          height: 650,
          slotDuration: "00:15:00",
          slotEventOverlap: false,
          loading: function(bool){
              if (bool) 
                  $('#loading').show();
              else 
                  $('#loading').hide();
          },
          events: eventsPath,
          allDay: false,

      });
  });
</script>

可以通过eventRender回调向特定事件添加样式。事件已经呈现,因此您需要更改样式/直接向元素添加类

$('#calendar').fullCalendar({
    ...
    eventRender: eventRenderCallback,
    ...
});

function eventRenderCallback(event, element){
    element.addClass(event.className);
}

<style>
    .myClass{
        background-color:red !important;
    }
</style>
$(“#日历”).fullCalendar({
...
eventRender:eventRenderCallback,
...
});
函数eventRenderCallback(事件,元素){
element.addClass(event.className);
}
.myClass{
背景色:红色!重要;
}

问题是什么?
$('#calendar').fullCalendar({
    ...
    eventRender: eventRenderCallback,
    ...
});

function eventRenderCallback(event, element){
    element.addClass(event.className);
}

<style>
    .myClass{
        background-color:red !important;
    }
</style>