FullCalendar中如何使用selectAllow限制日期选择范围？

你当前的问题是误用了selectAllow的用法——它并非直接接收包含start/end的对象，而是需要传入一个判断函数，通过函数返回true或false来决定是否允许选中当前范围。

正确实现方式 #

将selectAllow改为函数形式，在函数内判断选中的日期是否在目标范围内：

calendar = new FullCalendar.Calendar(calendarEl, {
    schedulerLicenseKey: 'GPL-My-Project-Is-Open-Source',
    initialView: 'timeGridWeek',
    selectable: true,
    selectMirror: true,
    placeholder: true,
    selectAllow: function(selectInfo) {
        // 定义允许选择的起止日期
        const allowedStart = new Date('2022-10-24');
        const allowedEnd = new Date('2022-10-25');
        
        // 确保选中的起始时间不早于允许的起始，结束时间不晚于允许的结束
        return selectInfo.start >= allowedStart && selectInfo.end <= allowedEnd;
    }
});
calendar.render();

补充说明 #

• selectInfo参数包含选中范围的start、end等标准Date对象，直接进行日期比较即可
• 若只需限制起始或结束单一维度，可简化判断逻辑（比如仅判断selectInfo.start >= allowedStart）
• 如果需要和businessHours规则叠加，可在函数内同时加入对应判断条件

内容的提问来源于stack exchange，提问作者Xavier Patiño