如何在fullcalendar上获取外部拖放事件的开始和结束日期

我有一个关于fullcalendars拖放function的快速问题。

这是我的JS代码

$('#calendar').fullCalendar({ header: { left: 'prev,next today', right: 'title' }, editable: true, droppable: true, // this allows things to be dropped onto the calendar !!! drop: function(date, allDay) { // this function is called when something is dropped // retrieve the dropped element's stored Event Object var originalEventObject = $(this).data('eventObject'); console.log(originalEventObject.title); // we need to copy it, so that multiple events don't have a reference to the same object var copiedEventObject = $.extend({}, originalEventObject); // assign it the date that was reported // console.log(originalEventObject.start); // console.log(originalEventObject.end); copiedEventObject.start = date; copiedEventObject.allDay = allDay; // render the event on the calendar // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/) $('#calendar').fullCalendar('renderEvent', copiedEventObject, true); // is the "remove after drop" checkbox checked? if ($('#drop-remove').is(':checked')) { // if so, remove the element from the "Draggable Events" list $(this).remove(); } } }); 

我想创建一个名为var dragged_event的新变量，它看起来像下面的每个拖放事件。

 var dragged_event = "Name: " + originalEventObject.title + ", Start: " + ??? + ", End: " + ??? 

所以输出看起来像是类似的东西

 console.log(dragged_event); //Name: Birthday Start: Mar 06 2014 End: Mar 08 2014 

目前我无法确定如何获取拖动事件的开始日期和结束日期。 请问有人帮我解决这个问题吗？

谢谢你的阅读。

Answer 1

你可以尝试类似的东西

 drop: function (date, allDay) { console.clear(); console.log("dropped"); console.log(date.format()); var defaultDuration = moment.duration($('#calendar').fullCalendar('option', 'defaultTimedEventDuration')); var end = date.clone().add(defaultDuration); // on drop we only have date given to us console.log('end is ' + end.format()); // retrieve the dropped element's stored Event Object var originalEventObject = $(this).data('eventObject'); // we need to copy it, so that multiple events don't have a reference to the same object var copiedEventObject = $.extend({}, originalEventObject); // assign it the date that was reported copiedEventObject.start = date; copiedEventObject.allDay = allDay; copiedEventObject.backgroundColor = $(this).css("background-color"); copiedEventObject.borderColor = $(this).css("border-color"); // render the event on the calendar // the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/) $('#calendar').fullCalendar('renderEvent', copiedEventObject, true); // is the "remove after drop" checkbox checked? if ($('#drop-remove').is(':checked')) { // if so, remove the element from the "Draggable Events" list $(this).remove(); } } 

给出了这个结果

或者按照这个例子。

• http://jsfiddle.net/dg9gp3e3/3/

Answer 2

有超负荷

drop：function（date，allDay）

是的

drop：function（start，end，allDay）

开始日期和结束日期存储在“开始”和“结束”变量中。