我的全日歷背景顏色不適用於 listDay 或 listWeek，但適用於月份

Question

在我的 fullcalendar ajax 數據中，我有一個名為 backgroundc 的字段，它表示事件的背景顏色更改為紅色。 這在默認的月份視圖中非常有效，但在 listDay 或 listWeek 視圖中卻沒有，甚至在檢查代碼時，tr 類 fc-list-item 確實將這些事件的背景顏色屬性顯示為紅色。 我還有一個 qtip 事件正在運行，它適用於所有視圖。 我正在運行 fullcalendar 3.0.1 這是我的日歷代碼。

<script type="text/javascript">
        $(function(){
            $("#divcalander").fullCalendar({
                aspectRatio: 1.6,       
                header:{
                    left: 'prev,next today',
                    center: 'title',
                    right: 'month,listWeek,listDay,listMonth'
                },
                views:{
                    month:{
                        titleFormat: '[MCH In-Sevices for ]'+'MMMM YYYY'
                    },
                    listWeek:{buttonText: 'List Week'},
                    listDay:{buttonText: 'List Day'},
                    month:{buttonText: 'Month'},
                    listMonth:{buttonText: 'List Month'}
                },
                theme: true,
                events:{
                    url:'populateinservicecal.php',
                    type:"get",
                    dataType:"json",
                    data:{startParam:'startDate',endParam:'endDate'}        
                },
                eventRender:function(event,element){
                    element.qtip({
                        content:
                            {text:"Location: "+event.locationdescr,
                            title:event.title},
                         position: {
                            my: 'bottom left',
                         style:{
                            classes: 'qtip-cream'
                         }
                        }                                 
                    })
                    if(event.backgroundc=="Red"){
                        element.css('background-color','Red')
                    }
                                                
                },
                eventLimit: false,
                timeFormat: 'h:mmt'
            })
        })
    </script>
    
    
    
    <title>HRS Class Sessions</title>
</head>
<body>
    
    <div style=" margin: auto; width: 900px;">
        <div style="height: 20px;"></div>
        <div id="divcalander"></div>
        </br>
        <div id="statementdiv">
        <h2 id="redstatement">Any event with a red background is a mandatory annual inservice.</h2>
        </div>
    </div>

這是對工作正常的月份事件的檢查。

<td class="fc-event-container">
<a class="fc-day-grid-event fc-h-event fc-event fc-start fc-end" data-hasqtip="40" aria-describedby="qtip-40" style="background-color: rgb(255, 0, 0);">
    <div class="fc-content">
        <span class="fc-time">10:30a</span> 
        <span class="fc-title">The Class</span>
    </div>
</a>

現在這里是對同一事件的 listDay 視圖的檢查

<tr class="fc-list-item" data-hasqtip="68" aria-describedby="qtip-68" style="background-color: rgb(255, 0, 0);">
<td class="fc-list-item-time ui-widget-content">10:30a</td>
<td class="fc-list-item-marker ui-widget-content">
    <span class="fc-event-dot"></span>
</td>
<td class="fc-list-item-title ui-widget-content">
    <a>The Class</a>
</td>

正如您所看到的，月份事件上的 a 標記具有顯示在日歷上的背景顏色紅色，但在 listDay 視圖中，沒有顯示 tr 的背景顏色。 我嘗試了幾種不同的方法都無濟於事。

Answer 1

你能檢查你的代碼是否與這個小提琴不同嗎？

$(document).ready(function() {
    $('#calendar').fullCalendar({
 aspectRatio: 1.6,   
 theme: true,
 eventLimit: false,
            timeFormat: 'h:mmt',
        header:{
                left: 'prev,next today',
                center: 'title',
                right: 'month,listWeek,listDay,listMonth'
            },
            views:{
                month:{
                    titleFormat: '[MCH In-Sevices for ]'+'MMMM YYYY'
                },
                listWeek:{buttonText: 'List Week'},
                listDay:{buttonText: 'List Day'},
                month:{buttonText: 'Month'},
                listMonth:{buttonText: 'List Month'}
            },
        defaultView: 'month',
  events: [
            
            {
                title: 'Meeting',
                start: '2016-12-01T10:30:00',
                end: '2016-12-01T12:30:00',
      backgroundc: 'red'
            },
        {
                title: 'Meeting 2',
                start: '2016-12-01T12:30:00',
                end: '2016-12-01T14:30:00',
      backgroundc: 'green'
            }
        ],
eventRender:function(event,element){
if (event.backgroundc == 'red') {
               element.css('background-color', '#ff0000');
               }
            },


});
});

https://jsfiddle.net/5wuop1z0/

我的全日歷背景顏色不適用於 listDay 或 listWeek，但適用於月份

問題描述

1 個解決方案

解決方案1
0 2016-12-01 17:57:20

我的全日歷背景顏色不適用於 listDay 或 listWeek，但適用於月份

問題描述

1 個解決方案

解決方案1 0 2016-12-01 17:57:20

解決方案1
0 2016-12-01 17:57:20