如何突出显示从URL检索到的日历上的特定日期?

时间:2017-01-16 21:13:18

标签: javascript css fullcalendar

我正在使用FullCalendar来允许用户选择特定日期,从数据库中检索数据,然后使用该数据重新加载页面。正在使用URL中的选定日期重写页面。

在重新加载时,我使用defaultDate参数获取日期并加载日历,并且它会移动到所选日期,但是没有所选日期的视觉突出显示。

$(document).ready(function() {

    var newDate = getUrlVars()["scheduled_date"];
    // console.log(newDate);

    $('#scheduled_calendar').fullCalendar({

        <!--Header Section Including Previous,Next and Today-->
        header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,basicWeek,basicDay'
        },

        <!--Default Date-->
        // defaultDate: '2015-02-12',
        defaultDate: newDate,
        editable: true,
        eventLimit: true, // allow "more" link when too many events


        dayClick: function (date, jsEvent, view) {
            // console.log(date.format());
            var currentUrl = window.location.href;

            $(".fc-state-highlight").removeClass("fc-state-highlight");
            $(this).addClass("fc-state-highlight");

            newURL = addURLParam(currentUrl,"scheduled_date", date.format())
            location.href = newURL;
        }

    });

    if (newDate > "0000-00-00") {
        $('#scheduled_calendar').fullCalendar('gotoDate', newDate);
    }
});

1 个答案:

答案 0 :(得分:0)

找到有用的东西。编辑了最后的if语句。

    if (newDate > "0000-00-00") {
        $('#scheduled_calendar').fullCalendar('gotoDate', newDate);

        $('.fc-day[data-date="' + newDate + '"]').css('background-color', "lightcyan");
    }

但是在文档中找不到.fc-day对象。