FullCalendar : 在选择期间忽略事件

Question

我使用 fullCalendar月视图创建了一个月历。

在我的日历上，我每天只显示一个事件。此事件用于显示用户的状态（可用、不可用、忙...）

因为我每天总是有 1 个事件，所以我设置eventLimit为 true 以避免多个事件，并且因为这个事件大约是一整天，我还设置editable为 false 以防止事件的拖放。

这是我的代码：

$('#calendar').fullCalendar({
    editable: false, // Prevent event drag & drop
    events: '/json/calendar', // Get all events using a json feed
    selectable: true,
    eventLimit: true, // Only 1 event per day
    header: {
        left: 'prev,next',
        center: 'title',
        right: 'today'
    },
    select: function(start, end) {
        window.location.hash = '#oModal-calendar'; // Display some popup with a form
        end.subtract(1, 'days');
        $('#checkboxButton').data('start', start);
        $('#checkboxButton').data('end', end);
        $('#calendar').fullCalendar('unselect');
    }
});

我希望我的用户能够直接从日历中选择日期，所以我selectable: true在日历的选项中进行了设置。但是，我收到很多反馈说“它没有用”。
经过一番调查，我发现用户经常点击事件块而不是当天。
由于默认情况下事件是可拖动的，因此单击事件不会触发选择，并且因为我已设置editable为 false 它不再执行任何操作。
这种组合导致我的用户认为存在错误。

---

我希望 fullCalendar 选择像日历上没有事件一样工作。我怎样才能实现这种行为？

编辑：这是一个基于完整日历示例和我的代码的jsfiddle

Answer 1

我终于找到了解决方案。

FullCalendar事件的点击绑定到css类fc-day-grid-event。

可以用一行 css 简单地忽略它pointer-events: none;。

.fc-day-grid-event {
  pointer-events: none;
}

这是更新的Jsfiddle。