Question

我正在尝试这样做，以便当您将鼠标放在我的日历中的事件上时，它会改变颜色。我可以做到并且它有效，但事件是不同的颜色，我只知道如何使事件变回一种颜色，而不是一种颜色。所以，即使我有红色，蓝色和绿色事件，只要将鼠标放在它们上面，它们就会变红。我只希望id为“rto”的事件变成红色，那我该如何实现呢？

<script type='text/javascript'>

$(document).ready(function() {

     var cal = $('#calendar')

   cal.fullCalendar({
    eventSources: [

        {
            url: "...",
            borderColor: 'green',
            id: "events",
        },
        {
            url: "...",
            borderColor: 'red',
            id: "rto",
        },
        {
            url: "...",
            borderColor: 'blue',
            id: "goals",
        },
                    ],

eventMouseover: function(){

            $(this).css('border-color', 'orange');

        },
eventMouseout: function() { 

            $(this).css('border-color', 'red');

        }
    }); 
});

这是你使用函数的方法：function（event，jsEvent，view）{}

Answer 1

我没有直接设置样式，而是建议在eventMouseover回调中添加一个css类，并在eventMouseout处理程序中删除它。

使用Javascript：

eventMouseover: function (event, jsEvent, view) {
    jQuery(this).addClass("current_entry");
},
eventMouseout: function (event, jsEvent, view) {
    jQuery(this).removeClass("current_entry");
},

CSS：

#calendar .current_entry
{
    border-color: #ff0000;
    border-width: 4px;
    z-index: 100 !important;
}

其中“calendar”是日历容器元素的ID

如何在FullCalendar中使用'eventMouseout'回调？

1 个答案: