fullCalendar eventResize 函数从未触发

Question

抱歉，如果这是重复的。我在发布此之前进行了很多搜索，但找不到答案。

我正在使用 fullCalendar。它显示了一个漂亮的日历，并且使用 "editable: true" 选项我可以拖动事件并将其移动到页面上的任何日期。但问题是 "eventResize" 函数从未被调用过。我的代码如下

function calendar() {
    $('#calendar').fullCalendar({
        locale: 'nl',
        header: {
            left:'prev,next today',
            center: 'title',
            right: 'month,agendaWeek,agendaDay'
        },
        timeFormat: 'H:mm',
        allDaySlot: false,
        eventSources: [
            {
                url: '/mypath/get_events',
                type: 'post',
            }
        ],
        eventColor: '#cccccc',
        editable: true,
        eventResize: function(event,dayDelta,minuteDelta,revertFunc) {
            alert("let's change the dates");
        },
        slotEventOverlap: true,
        height: 'auto',
        droppable: false
    });
}

当然我有下面的在上面

<link rel="stylesheet" href="/mypath/fullcalendar/fullcalendar.min.css">
<link rel="stylesheet" href="/mypath/fullcalendar/fullcalendar.print.css" media="print">
<script type="text/javascript" src="/mypath/fullcalendar/jquery.min.js"></script>
<script type="text/javascript" src="/mypath/fullcalendar/moment.min.js"></script>
<script type="text/javascript" src="/mypath/fullcalendar/fullcalendar.min.js"></script>

我使用的是 fullCalendar 2.2.5 版，如果有的话。

Answer 1

我认为您正在寻找 eventDrop 活动。 eventResize 在日视图中调整事件大小时触发，例如当你拖动底部的事件在一个小时后结束。

eventDrop: function(eventDropInfo) {
  console.log(eventDropInfo)
}

Docs for eventDrop

Answer 2

你看错了回调。

根据 docs，eventResize 仅在事件的持续时间发生变化时发生 - 即事件现在具有不同的长度，因为您更改了开始或结束日期，但不是两者。（在 UI 中，这是通过单击并拖动事件的顶部或底部边框来更改其大小来完成的。）

如果您将活动移动到另一个 date/time，而不更改其 length/duration，那么您并不是在调整它的大小，而是在拖放它。这就是事件没有被触发的原因。

您需要改用 eventDrop 回调。当拖动停止并且事件移动到不同的 day/time 时触发。例如

eventDrop: function( event, delta, revertFunc, jsEvent, ui, view ) { 
  alert("event was moved");
}

fullCalendar eventResize 函数从未触发

fullCalendar eventResize function never triggered

javascript

fullcalendar

fullcalendar-2