【发布时间】：2019-06-26 12:11:26
【问题描述】：
谁能告诉我应该使用哪个全日历事件回调 处理以下情况：当前外部事件停止拖动 并且它不是通过外部事件框本地化的，也不是通过日历本地化的？
知道我有这两种方法 isEventOverDiv //如果我们（不）在外部事件上返回真/假，isEventOverDivCal //如果我们（不）在日历上返回真/假
我在eventDragStop中试过：函数（事件、jsEvent、ui、视图）
eventDragStop: function (event, jsEvent, ui, view){
// if the event is not over the external events box and neither over the calendar
if(!isEventOverDiv(jsEvent.clientX, jsEvent.clientY) && !isEventOverDivCal(jsEvent.clientX, jsEvent.clientY) ) {
// reset
var reccupuredIndexForTitle=$(this).attr('id');
$scope.ctrlendDragging(reccupuredIndexForTitle);
}
}
//return true if we are over the external events
var isEventOverDiv = function (x, y) {
var external_events = $('#external-events');
var offset = external_events.offset();
offset.right = external_events.width() + offset.left;
offset.bottom = external_events.height() + offset.top;
// Compare
if (x >= offset.left &&
y >= offset.top &&
x <= offset.right &&
y <= offset.bottom) {return true;}
return false;
};
//return true if we are over the calendar
var isEventOverDivCal = function(x, y) {
var external_events = $( '#calendar' );
var offset = external_events.offset();
offset.right = external_events.width() + offset.left;
offset.bottom = external_events.height() + offset.top;
// Compare
if (x >= offset.left
&& y >= offset.top
&& x <= offset.right
&& y <= offset .bottom) { return true;}
return false;
}
但它不起作用。
更新 2
为了克服在日历行程中将事件置于虚拟滚动条上方的障碍
1- 我从 mycontroller $scope.ctrlstartDragging 申请 （从 HTML 视图中触发 ondragstart="angular.element(this).scope().ctrlstartDragging(id)" 回调）。
$scope.ctrlstartDragging = function(id) {
var book = document.getElementById(id);
var domRect = absolutePosition(book);
book.style.position = 'fixed';
book.style.top = domRect.top + 'px';
book.style.left = domRect.left + 'px';
book.style.width=(domRect.width) + 'px';
};
并且能够取消设置css样式（位置左上角宽度）
（注意：ondragend="angular.element(this).scope().ctrlendDragging(id)" 回调）
没有被解雇，我不知道为什么，但在我的情况下这不是问题）
所以目的是我应该手动调用
$scope.ctrlendDragging = function(id) {
var book = document.getElementById(id);
book.style.position = 'relative';
book.style.top = 'unset';
book.style.left = 'unset';
book.style.width='unset';
};
按照我说的做，以防用户在拖动过程中中止将事件放在日历上，并且该事件位于外部事件框和日历之外。
但在我的情况下，请参阅MyPlunk 我需要在应用还原时，在将此事件还原到外部事件框期间需要使用以下方法对其进行调用
// reset
var reccupuredIndexForTitle=$(this).attr('id');
$scope.ctrlendDragging(reccupuredIndexForTitle);
所以我需要在应用还原时应用这两行 因为如果在用户中止拖入日历时未应用它们 事件恢复，但未将未设置的 CSS 样式应用于 .style.position 左上角宽度 我会在外部事件框顶部获得一个孤立的外部事件，如下所示：
非常感谢。
【问题讨论】：
-
我不认为有任何特定的方法可以用来检测这样的事情。 fullcalendar.io/docs/eventReceive 将检测何时将外部事件拖到日历上。据我所知，如果用户将外部事件拖动到不是日历的区域，则不会运行 fullCalendar 回调 - 因为 fullCalendar 没有检测到自身发生的任何事情，因此不关心该事件。当然，如果用户这样做，那是没有意义的，他们只是犯了一个错误？该功能的重点是允许用户将内容拖到日历上。
-
非常感谢 ADyson 的回答。我更新了查看更新以获取更多信息。
-
也许我在你说的话中遗漏了一些重要的东西，但你似乎让它变得非常复杂。我找到了一个 CodePen，它似乎有一些与您的代码相似的代码，但似乎也可以完成您需要的所有事情 - 可以将事件拖到日历上，也可以再次拖回“外部事件”列表。如果事件被丢弃在这两个区域之外的任何地方，它会回到它开始的地方。在这里看到它：codepen.io/subodhghulaxe/pen/qEXLLr。该演示中是否还有其他需要您做的事情？
-
再次感谢 ADyson 查看更新 2。清楚地看到问题到底出在哪里。
标签： fullcalendar