避免FullCalendar中的事件叠加

Question

您好，我正在尝试避免FullCalendar应用中的事件重叠。 我已经定义了eventDrop回调，以便它检查是否有任何重叠的事件，并通过相应地更改event.start和event.end ，然后调用.fullCalendar('updateEvent', event) 。

这是我的代码， moment调用是针对http://momentjs.com/docs/的 ，这是一个用于javascript的时间处理工具库，我认为这不是问题的罪魁祸首。 如果我注释掉行event.start = start; event.end = end event.start = start; event.end = end ，然后一切正常。 如果不这样做，无论是否调用updateEvent ，它都会以完全相同的方式中断。 发生的情况是：事件确实移到了前一个事件的末尾，但是如果我尝试将事件移到以后的某个日期（当天晚些时候移至空白处），则前一个事件将在视觉上扩展到新的开始当前正在修改的事件。

self.collection是一个主干集合，因此仅在event.start=位加注释的情况下调用此代码将显示事件重叠，但是如果刷新页面，则事件将显示在正确的位置（不重叠）

eventDrop: function(event, dayDelta,
                    minuteDelta, allDay,
                    revertFunc, jsEvent, ui, view) {
    var start = moment(event.start);
    var end = moment(event.end);
    var overlap = self.calendar.fullCalendar('clientEvents', function(ev) {
        if( ev == event)
            return false;
        var estart = moment(ev.start);
        var eend = moment(ev.end);
        return estart.unix() < end.unix() && eend.unix() > start.unix();
    });
    if( overlap.length ) {
        overlap = overlap[0];
        var estart = moment(overlap.start);
        var eend = moment(overlap.end);
        var duration = eend - estart;
        start = eend;
        end = start.clone();
        end.add(duration);
        event.start = start.toDate();
        event.end = end.toDate();
        self.calendar.fullCalendar('updateEvent', event);
    }
    event.model.save({start: start.unix(), end: end.unix()});
},

Answer 1

好的，找到了问题。

这行说

start = eend;

应该

start = eend.clone();

因为将其包装在一个moment对象中并没有做，它只是保留了一个引用，并将新移动的事件的start日期设置为与overlap.end相同的Date 对象 overlap.end

Answer 2

您还有另一个错误，持续时间应为

var duration = end - start;

因为在您的方法中，它计算重叠事件的持续时间，而不是您刚刚移动的事件的持续时间