javascript - Jquery如何指定哪个droppable应该与嵌套的droppable元素一起使用

Question

我有一个小问题，我似乎无法自己解决。看看这个 fiddle :JSfiddle

这是我遇到的问题的一个基本示例。我有一个大 div，它是一个可放置区域。在这个可放置区域内有多个其他可放置区域。

当元素被放置时，内部可放置区域应该遍历其代码。相反，外部 div 中的代码似乎可以运行。难道我做错了什么？ div 周围的区域应保持这种状态，因为可以将元素放置在此处(未正式删除)。

我希望我的问题足够清楚，但我认为 fiddler 不言而喻。

附注- 在此示例中调整大小不起作用，但在我的开发环境中起作用。

<小时/>

拉斯蒂和马克，谢谢您的回复。

对于令人困惑的缩放器，我深表歉意。我刚刚从代码中删除了它。 New Fiddler

只是为了澄清事情。 box div 是一个容器，里面有多个图像。我正在努力实现以下目标: http://postimage.org/image/qwhtik04f/灰色虚线框是我的示例中的 dropbox2 div。这些保管箱周围的空间是保管箱 div。

有木板的空间是唯一可以在不发生任何事情的情况下掉落图像的地方。拖动的图像可以快速恢复到 dropbox2 div。如果将图像拖到 dropbox div 上，图像应该恢复。

Answer 1

在内部 droppable 上设置 greedy: true 选项将阻止该事件在外部 droppable 上发生:

jQuery('#dropbox2').droppable({
    greedy: true,
    drop: function(event, ui) {
        // ...
    }
});