jQuery UI-Droppable仅接受一个可拖动对象 [英] jQuery UI - Droppable only accept one draggable
问题描述
我正在制作一个应用程序,该应用程序使用一个可放置的div
和一些可拖动的div
.如何使可放置项不接受多个可拖动的div
?我用Google搜索,但没有找到任何解决方法.
I'm making an app, that is using one droppable div
and a few draggable div
s. How can I make the droppable to not accept more than one draggable div
? I Googled, but didn't find any workaround.
我想到了一种解决方法.我如何检查此droppable div中是否有放置元素?如果很忙,请还原此可拖动对象,并尝试将其拖放
A workaround came up in mi mind. How can i check is there's dropped element in this droppable div? If it's busy then revert this draggable, which is trying to be dropped
推荐答案
OK为此找到了一个不错的解决方案,本质上是在'drop'上,我将droppable设置为仅接受已拖动到其中的项目.
OK found a nice solution for this, essentially on 'drop' I set the droppable to only accept the item which has been dragged into it.
当您禁用"时,您需要重新初始化的退出"事件不再可用,因此我只是切换了符合条件的项目.
When you 'disable', the 'out' event that you need to re-initialize isn't available anymore, so instead I just switched the eligible items around.
然后,我可以使用OUT事件重新接受所有可拖动项目,并且由于没有接受其他任何东西,因此OUT不会被其他可拖动对象触发:
Then it's possible for me to use the OUT event to re-accept all draggable items and because nothing else is accepted the OUT won't be triggered by other draggables:
$(".drop-zone").droppable({
drop: function(event, ui) {
$(this).droppable('option', 'accept', ui.draggable);
},
out: function(event, ui){
$(this).droppable('option', 'accept', '.drag-item');
}
});
});
这篇关于jQuery UI-Droppable仅接受一个可拖动对象的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!