Question

我正在制作一个jQuery UI sortable，我需要检测何时将一个元素拖出它。听起来完全就像out event的工作-除了我本人最初想念的一小句话：

注意：删除可排序项目时也会触发此事件。

对我来说，这是一个重大的突破。每当仅重新排列项目时，拖动的项目 still 最终都会获得一个out事件。我一直在绞尽脑汁，但到目前为止还没有醒悟。 如何检测out事件是由于确实将项目拖到了外面，还是仅仅是因为拖动操作停止了？

_{（如果重要，jQuery UI版本1.11.4）}

已添加

：

好的，我想我自己成了“仅剩最后一个荒谬的部分”陷阱的受害者。我试图做的是有两个可排序的对象，它们之间可以拖动项目。类似于the example，但是当将项目拖到所有可排序对象之外时，占位符会完全消失。这就是为什么我要跟踪哪些项目在内部以及哪些项目在外部。

我最终解决它的方法是放弃此“要求”。无论如何，如果留有占位符会更好，因为它显示了放开鼠标时该项目将放置到的位置-即使它在外面。

但是，如果我确实想保留此路径，那么我现在看到正确的解决方案是在out事件上隐藏占位符，并在over事件上显示占位符。即使没有开始从外部拖入任何物品，即使开始拖动也有over。

无论哪种方式，尽管两种方法都可以解决我的实际问题，但它们都不能真正回答我所提出的问题，因此我将保留它。

Answer 1

我认为这是正确的答案：

var interval;
var outside = false
$(button).addEventListener('mousedown',function(e) {
    interval = setInterval(function() {
        if (outside) {
            //fire event
        }
    },1000); // 1000 ms between each frame
});
// This code will stop the interval if you move your mouse away from the field while still holding it.
$(button).addEventListener('mouseout',function(e) {
    outside = true;
    clearInterval(); //function to clear interval
});

Answer 2

不确定我是否在这里达到目标，还有其他陷阱。

示例：https://jsfiddle.net/Twisty/83Lwxkrs/

JavaScript

out

return days可用于删除占位符。因此，当拖动的项目离开时，poof和占位符都消失了。将其拖到另一个或相同对象上时，便会重新创建占位符。

陷阱：将项目拖放到任何可排序的项目之外，则项目将落空。占位符将被删除，拖动的项目也将被删除。我怀疑可以解决此问题，方法是查找拖放或将鼠标悬停并在可排序尝试还原位置之前重新创建占位符。

如何检查元素是否拖到JQuery UI Sortable之外？

2 个答案: