[英]JQueryUI draggable/droppable get uppermost dropped div
I am having a problem that is best illustrated by this Fiddle I stumbled upon: 我遇到了一个问题,我偶然发现了这个小提琴:
http://jsfiddle.net/JSFU4/3/ http://jsfiddle.net/JSFU4/3/
This is, when I am draggind an object and hovering over its droppable counterpart, the drop is detected EVEN IF there is a div in between them. 也就是说,当我拖拽一个对象并将其悬停在其可放下的对象上时,即使在它们之间有一个div,也会检测到该放下。 I want to avoid this.
我想避免这种情况。
From what I've understood reading the docs, there is no out-of-the-box solution to do it, but maybe an option could be to get the 'real' uppermost div in which the dragged element was dropped and avoid action if it is the overflown div. 根据我对阅读文档的了解,目前还没有开箱即用的解决方案,但是可能的选择是获取“真正的”最上面的div,将拖放的元素放入其中,并避免采取行动它是溢出的div。 (This is just an idea though).
(尽管这只是一个想法)。
In other words, say I have a droppable div called droppable-div , a div that is on top of it called on-top-non-droppable-div ... could I detect this in the dropped function? 换句话说,假设我有一个名为droppable-div的droppable div ,位于它之上的div称为on-top-non-droppable-div ...我可以在drop函数中检测到它吗?
dropped: function(ev, ui){
// somehow detect if the first target to receive the draggable event
// is #on-top-non-droppable-div, and don't do anything if it is.
}
Maybe that's fitting your needs: 也许这符合您的需求:
$(function () {
$('.drag').draggable();
$('.drop, .overlay').droppable({
tolerance: 'touch',
hoverClass: 'drop-hover',
accept: '.drag',
drop: function (event, ui) {
if ($(this).hasClass('overlay')) {
ui.draggable.draggable({
revert: true
});
} else {
ui.draggable.draggable({
revert: "invalid"
});
}
}
});
});
Here example setting tolerance: 'pointer',
在此示例中设置
tolerance: 'pointer',
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.