Jquery拖放中的停止放置事件答案

【问题标题】：Stop drop event in Jquery drag&dropJquery拖放中的停止放置事件
【发布时间】：2013-04-04 13:59:50
【问题描述】：

我在使用 Jquery 拖放时遇到了这个问题。我有两个 div 元素堆叠在一起。底部的 div 是可放置的并且更大。如果我在上部 div 上放置一个项目，则底部 div 处理 dropp。

如何让 div 仅在元素被直接拖放时才处理拖放。

我尝试在上层 div 上使用stopPropagation()，但没有奏效。

某种简单的例子：http://jsfiddle.net/e87wS/13/

【问题讨论】：

标签： jquery dom drag-and-drop

【解决方案1】：

修改后的答案

使用over 和out 禁用和启用另一个div。 greedy 表示可放置区域将是唯一有效的区域，tolerance: touch 表示只要可拖动对象接触可放置区域，它就会放在那里。

看起来像这样：

$('#div2').droppable({
    drop: function (event, ui) {
        alert("droppedHere");
    },
    greedy: 'true',
    tolerance: 'touch',
    over: function (event, ui) {
        $("#div1").droppable("disable")
    },
    out: function (event, ui) {
        $("#div1").droppable("enable")
    }
});

$('#div1').droppable({
    drop: function(event, ui){
        alert("droppedThere");
    }
});

还有小提琴：http://jsfiddle.net/e87wS/15/

【讨论】：

我需要红色 div 来处理 drop。然后容差选项失败。 jsfiddle.net/e87wS/8即使掉到果岭上也会给你警报！
你能解释一下为什么底部 div 会处理 drop 吗？你是怎么做到的？
假设要拖动的图片应该放在绿色 div 上...当您拖动它时，红色 div 会接受它。我希望红色 div 只有在被拖出绿色 div 时才能接受它。
好的，我看到了问题，我认为我更新的答案至少应该为您指明正确的方向
感谢您的回答，但在我的情况下这不起作用。是否可以在绿色 div 上捕获事件，然后以某种方式阻止它的传播。