如何强制jquery ui draggable在mouseup调用后重新启动

Question

我有一个可拖动的div #box 能够移入更大的 #dashboard ，我可以仅通过另一个div看到它，小于仪表板 #window

这是订单：
<div id=’dashboard’> <div id=’window’ > <div id=’box’ ></div> </div> </div>

我正在寻找的是当 #box 到达 #window 的边框时重新进行自动搜集动作EM> 即可。 因此，在窗口mouseleave（拖动时）我绑定一个setInterval，开始以相反的方向移动 #dashboard 。

我注意到可拖动的 #box 停止移动，因为用户在退出窗口时停止移动鼠标（当他按下它时）期待移动到继续自己。

所以我必须通过与 #dashboard 相反的动作强行移动可拖动的 #box 位置使它显然静止不动并靠近边界。

这会在 #box 和鼠标位置之间创建一个距离（在 #window 之外） ）当鼠标再次开始移动时，它将从此位置拖动 #box （太可怕了！）。

为了避免这种情况，我决定强制拖动当鼠标离开 #window tiggering mouseup时停止（我在论坛上看到这个并且它有效）。

现在，当鼠标重新进入 #window 时，我需要一种方法来限制阻力。 我该怎么办？

---

更新

我试着用图像来解释这种情况：
这里开始拖动窗口外的框移动 滚动窗口，它必须开始向后移动（调用setInterval（））
移动窗口导致框自身向后移动，因为它具有绝对位置
因此我必须将盒子重新定位在窗口边框附近，但是这会导致盒子和窗口外的鼠标指针之间的距离
现在的问题是：当鼠标再次移动并且拖动事件被触发时，它会“记住”与盒子的距离并神奇地移动它而不会触碰......

---

更新2：

我创建了一个jsFiddle来显示所有代码：here
要测试只是将 #box 移到右侧的 #window 之外，
#dashboard 将向后移动（停止它刚回到窗口内）。
不幸的是，发生了两件坏事：

1. 将在鼠标指针和框之间创建一个距离， 当你回到窗口时，将会拖动框 这个距离
2. 如果您继续将鼠标移到窗口外，则会启动该框 在“拖动位置”和“边框已更正”之间闪烁 位置。

第二个问题可以避免在调用setInterval之前添加此$("#box").trigger("mouseup");，但当鼠标重新进入窗口以再次触发拖动时，它需要一种相反的函数，如$("#box").trigger("mousedown"); ，因此我的问题的标题。

Answer 1

我已经暂时解决了（因为我仍然希望在更好的解决方案中）“ Nal ”建议：

1. 当 #box 开始拖动时，它会被 #clone 取代 （框上display: none）
2. 在拖动时， #clone 会获取 #box 的ui.position 它位于可见的 #window 内，如果是，则保留在边框内 鼠标指针熄灭
3. 停止拖动 #box 获取 #clone 的css('left')和 #clone 被删除后重新显示（display: block）。