如何在fullcalendar中以不同的颜色更改事件背景颜色？

Question

我正在使用fullcalendar的最新版本，我查看了文档如何更改背景颜色事件，但我不知道如何制作不同的事件。
我需要代码示例事件红色，蓝色，绿色，如图片。

我看到这个代码，在文档的网站，但我不能申请2种颜色：

$('#calendar').fullCalendar({ 
     editable: true,    events: [ 
      { 
       title: 'Teste1', 
       start: new Date(y, m, d, 10, 30), 
       allDay: false, 
       editable: false 
      }, 
      { 
       title: 'Teste2', 
       start: new Date(y, m, d, 11, 40), 
       allDay: false 
      }   ], eventColor: '#378006'  }); 

Answer 1

由于您使用的是最新版本（1.5），因此您可以设置backgroundColor属性。

{ 
    title: 'Teste1', 
    start: new Date(y, m, d, 10, 30), 
    allDay: false, 
    editable: false, 
    backgroundColor: '#SomeColor' 
}, 
{ 
    title: 'Teste2', 
    start: new Date(y, m, d, 11, 40), 
    allDay: false, 
    backgroundColor: '#SomeOtherColor' 
} 

您还可以设置textColor财产，如果你需要改变这一点。

Answer 2

使用CSS和className属性。

<style> 
.event { 
    //shared event css 
} 

.greenEvent { 
    background-color:#00FF00; 
} 

.redEvent { 
    background-color:#FF0000; 
} 
</style> 

<script> 
$('#calendar').fullCalendar({ 
     editable: true,    events: [ 
      { 
       title: 'Teste1', 
       start: new Date(y, m, d, 10, 30), 
       allDay: false, 
       editable: false, 
       className: ["event", "greenEvent"] 
      }, 
      { 
       title: 'Teste2', 
       start: new Date(y, m, d, 11, 40), 
       allDay: false, 
       className: ["event", "redEvent"] 
      }   ], eventColor: '#378006'  }); 
</script> 

Answer 3

我已经为每个事件应用了这样的颜色代码，它适用于我。

$.each(data, function(i, v){  
    var event =[];  
    var col = "";   
          if(v.Status == 1)  
          { 
           col = "#00c0ef"; 
          } 
          else if(v.Status == 2){ 
           col = "#dd4b39"; 
          }  
          else if (v.Status === 3) 
          {  
           col = "#f39c12"; 
          }  
          else { 
           col = "#00a65a"; 
          }  
         event.push({ 
          title: v.AssignedName + "\n Installation Date: \n" + da,  
          start: da,  
          backgroundColor: col,  
           textColor:'black'  
         }) 
});