添加字体真棒图标完整的日历标题

我使用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

添加字体真棒图标完整的日历标题

回答

相关问题