jquery – Fullcalendar – 突出显示基于事件选择的一天

在fullcalendar中,您可以选择一个事件(触发)eventClick函数/回调.我想做的是突出事件点击日期(在月视图中).

例如,如果事件是在10月30日,并且我选择事件,我想要突出显示的一天的背景颜色.这非常类似于fullcalendar如何处理今天的“今天”,今天以淡黄色亮起.

我似乎无法弄清楚如何将fc-event类或事件对象本身绑定到日历中的实际日div.我的10月30日事件出现在下面的div(这是10月30日的框)中：

<div class="fc-sun fc-widget-content fc-day35 fc-first">

基于事件对象,如何找到这个div(以便我可以突出显示它)？

解决方法

对不起,这是一个粗略的解决方案,大部分来自内存,因为我没有在这台电脑上安装任何开发工具.

希望这是你要找的！

//create fullCalendar:
$("#calendar").fullCalendar({
    /* options */

    eventClick: function(event,jsEvent){
        //use the passed-in javascript event to get a jQuery-wrapped reference
        //to the DOM element we clicked on.
        //i can never remember if this is .target,.currentTarget,or .originalTarget
        //... jquery has spoiled me
        var $clickedEvent = $(jsEvent.target);

        //tell the "selectionManager" to find the day this event belongs to,//and add the "selected" css class to it
        selectionManager.select($clickedEvent);
    }
});

//define an object that handles the adding-removing of the 'selectedDay' css class
var selectionManager = (function(){
    //i like making private variables :-)
    var $curSelectedDay = null

    //define a "select" method for switching 'selected' state
    return {
        select: function($newEvent) {
            if ($curSelectedDay){
                //if we already had a day chosen,let's get rid of its CSS 'selectedDay' class
                $curSelectedDay.removeClass("selectedDay");
            }
            //find the parent div that has a class matching the pattern 'fc-day',and add the "selectedDay" class to it
            $curSelectedDay = $thisEvent.closest('div[class~="fc-day"]').addClass("selectedDay");
        }       
    };
})();