如何在fullcalendar中禁用日期间隔?

时间:2016-07-15 16:51:25

标签: javascript jquery json fullcalendar

我遇到的问题是FullCalendar的文档中没有关于禁用间隔日期的信息。我有一个带有间隔日期的json对象,必须禁用

enter image description here

那么,我该如何禁用这个日期呢? 谢谢你的关注!

1 个答案:

答案 0 :(得分:0)

查看this example on Background Eventsdocs page for Background Events。以下是示例中的代码。

$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    defaultDate: '2016-06-12',
    businessHours: true, // display business hours
    editable: true,
    events: [
        {
            title: 'Business Lunch',
            start: '2016-06-03T13:00:00',
            constraint: 'businessHours'
        },
        {
            title: 'Meeting',
            start: '2016-06-13T11:00:00',
            constraint: 'availableForMeeting', // defined below
            color: '#257e4a'
        },
        {
            title: 'Conference',
            start: '2016-06-18',
            end: '2016-06-20'
        },
        {
            title: 'Party',
            start: '2016-06-29T20:00:00'
        },

        // areas where "Meeting" must be dropped
        {
            id: 'availableForMeeting',
            start: '2016-06-11T10:00:00',
            end: '2016-06-11T16:00:00',
            rendering: 'background'
        },
        {
            id: 'availableForMeeting',
            start: '2016-06-13T10:00:00',
            end: '2016-06-13T16:00:00',
            rendering: 'background'
        },

        // red areas where no events can be dropped
        {
            start: '2016-06-24',
            end: '2016-06-28',
            overlap: false,
            rendering: 'background',
            color: '#ff9f89'
        },
        {
            start: '2016-06-06',
            end: '2016-06-08',
            overlap: false,
            rendering: 'background',
            color: '#ff9f89'
        }
    ]
});

您可以看到背景事件允许您使用不同的颜色区域,您可以将overlap属性设置为false,然后无法将事件放置在那里。