javascript - 是否可以根据 FullCalendar 事件的标题指定其背景颜色?

标签 javascript jquery fullcalendar google-calendar-api

由于 FullCalendar 无法读取分配给 Google 日历中事件的颜色,因此我需要能够根据各个事件标题的文本内容设置事件显示方式的样式。

在阅读了尽可能多的关于此事的帖子后,FullCalendar 的“eventRender”似乎是最有可能采取的路线,但我能找到的最接近我需要的内容是:-

eventRender: function(event, element) {
                if(event.description == "blah blah") {
                    element.css('background-color', '#ff000');

我的问题是,(a) 我需要将 eventRender 应用于事件标题而不是其描述,并且 (b) 我需要它是 'if the title includes 单词 blah-blah',而不是“如果标题与 blah blah完全匹配

希望以上内容不要太乱码和无意义。我对这一切仍然非常摸索;因此,我们将不胜感激地收到任何帮助、建议、想法或正确方向的指导! :)

非常感谢您抽出时间。

编辑: 附加信息。我在 FullCalendar html 页面上使用的脚本(无 API key 和 Google ID)

<script>

        $(document).ready(function() {

        $('#calendar').fullCalendar({
            height: 'auto',
            header: {
                left: 'prev,next today',
                center: 'title',
                right: 'agendaDay,month',
            },

            eventRender: function(event, element) {
                if(event.description == "blah blah") {
                    element.css('background-color', '#ff000');
                }
            },

            // Google API key
            googleCalendarApiKey: 'xxxxxxxxx',

            // Diary Dates
            events: 'xxxxxxxxx',


            eventClick: function(event) {
                // opens events in a popup window
                window.open(event.url, 'gcalevent', 'width=700,height=600');
                return false;
            },

            loading: function(bool) {
                $('#loading').toggle(bool);
            }

        });

    });

    </script>

最佳答案

在 eventRender 回调中

if(-1 != event.title.indexOf("blah blah")) {
    element.find('.fc-title').css('background-color', '#ff000'); 
}

会做的。

或者更好的是,应用样式 element.addClass("event-bg-class");

关于javascript - 是否可以根据 FullCalendar 事件的标题指定其背景颜色?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28699868/

相关文章:

javascript - 查找文件名然后查找匹配的字符串

javascript - $(document).height() 在刷新时随机化值(Safari 5.1.10)

javascript - Jquery fullcalendar 不显示事件

javascript - 全日历刷新/重新定义所有事件

javascript - 当我在 jquery fullcalendar 中将 slotMinutes 设置为 50 值时出现错误

javascript - 我想从ckeditor动态获取数据到div

javascript - 使用 JavaScript 验证表单语句上的选择字段不起作用

javascript - 如何对 HttpClient.get 返回的 Observable 实现副作用?

php - 让 .get() 在 jquery 中工作

javascript - 维护CSS :hover effect for all items up a nested list chain