添加字體真棒圖標完整的日曆標題

我使用WordPress的，強大的表單和完整的日曆創建一個定製的解決方案日曆添加字體真棒圖標完整的日曆標題

我所擁有的一切，除了工作，我想在添加字體真棒圖標日曆中每個標題的前面。

如果我在下面的代碼中添加標題中的任何html，我只會看到打印的代碼，而不是最終結果。

$('#calendar').fullCalendar({ 
 
    events: [ 
 
     { 
 
      title : '<i class="fa fa-asterisk"></i>event1', 
 
      start : '2010-01-01' 
 
     }, 
 
     { 
 
      title : 'event2', 
 
      start : '2010-01-05', 
 
      end : '2010-01-07' 
 
     }, 
 
     { 
 
      title : 'event3', 
 
      start : '2010-01-09T12:30:00', 
 
      allDay : false // will make the time show 
 
     } 
 
    ] 
 
});

能任你點我在正確的方向？ :-)

問候

馬特

來源

2015-10-22 Matthew Barraud

需要預先設置它在渲染甚至回調 – charlietfl

我沒有使用完整日曆，但如果他們都將使用相同的圖標，你不能只給他們所有相同的類，然後使用「內容」CSS規則，並將其應用於：before或：after？ –

@JonathanBowman謝謝，希望不同的圖標取決於類別。 Charlietfl對FullCalendar＆JQuery來說真的很新鮮，所以不確定你的意思，你可以詳細說明一下嗎？ –

您可以修改標題前面加上eventRender函數內部字體真棒圖標。

我添加了一個帶鑰匙圖標的選項：如果圖標被定義，在eventRender函數中附加fontawesome圖標。

檢查這個例子：

$('#calendar').fullCalendar({ 
    events: [ 
    { 
     title : 'event1', 
     start : '2015-10-01', 
     icon : "asterisk" // Add here your icon name 
    }, 
    { 
     title : 'event2', 
     start : '2015-10-05', 
     end : '2015-10-07' 
    }, 
    { 
     title : 'event3', 
     start : '2015-10-09T12:30:00', 
     allDay : false // will make the time show 
    } 
], 
eventRender: function(event, element) { 
    if(event.icon){   
     element.find(".fc-title").prepend("<i class='fa fa-"+event.icon+"'></i>"); 
    } 
    }   
})

來源

2015-10-22 19:17:35 cesare

很好，非常感謝。 – Duque

@cesare你能看到這個嗎？ https://stackoverflow.com/questions/47525190/eventrender-in-fullcalendar-not-running –

@Mogambo我不能「頁未找到」 – cesare

如果要替換圖標文本，您可以使用下面的代碼

eventRender: function(event, element) { 
    element.find(".fc-title").html(function() { return $(this).html().replace("Rs", "<i class='fa fa-inr'></i>")}); 
}

來源

2017-01-02 18:07:35

添加字體真棒圖標完整的日曆標題

回答

相關問題