如何阻止全日历在轮询时中断拖动和调整大小

Question

我一直在尝试让 fullcalendar 对新事件的轮询做出反应，但是每当它调用 refetchEvents 时，如果我正在拖动或调整某些东西的大小，它就会阻止我，就好像我在我所在的位置释放了鼠标一样in，分别将事件移动或调整到错误的位置。

我有一个 jsfiddle，用于实际演示。

这是代码，如果有帮助的话：

$(document).ready(function() {

  /* initialize the calendar
  -----------------------------------------------------------------*/

  $('#calendar').fullCalendar({
    header: {
      left: 'prev,next today',
      center: 'title',
      right: 'month,agendaWeek,agendaDay'
    },
    editable: true,
    events: [{
      title: 'event1',
      start: '2017-01-26T08:00:00',
    end: '2017-01-26T10:00:00'
    }, {
      title: 'event2',
      start: '2017-01-05',
      end: '2017-01-07'
    }, {
      title: 'event3',
      start: '2017-01-09T06:30:00',
    end: '2017-01-09T09:30:00',
    }]
  });
});
setInterval(function() {
  $('#calendar').fullCalendar('refetchEvents');
  console.log('refetchEvents called');
}, 5000);

Answer 1

可能不是最有效的，在 eventDragStart 和 eventDragStop 上使用 fetchEventsLock 引用并仅在释放时获取事件 === false。

var fetchEventsLock = false;
$(document).ready(function () {

    /* initialize the calendar
    -----------------------------------------------------------------*/

    function toggleLock() {
        fetchEventsLock = !fetchEventsLock;
        console.log('Set To ' + fetchEventsLock)
    }
    $('#calendar').fullCalendar({        
        eventDragStart: toggleLock,
        eventDragStop: toggleLock,
        /* Other option removed */

    });
});
setInterval(function () { 
    if (fetchEventsLock === false) {
        $('#calendar').fullCalendar('refetchEvents');
        console.log('refetchEvents called');
    }
}, 5000);

如何阻止全日历在轮询时中断拖动和调整大小

How to stop fullcalendar from interrupting dragging and resizing when polled

javascript

fullcalendar

fullcalendar-scheduler