HTML
<div id="dropableArea">Drop area</div>
<hr>
<ul>
<li class="dragModule">Item 1</li>
<li class="dragModule">Item 2</li>
<li class="dragModule">Item 3</li>
</ul>
jQuery
$(function(){
$('.dragModule').draggable({connectToSortable:'#dropableArea',helper: 'clone'});
$('#dropableArea').droppable({
accept: '.dragModule',
activeClass:'active-droppable',
drop:function(){
console.log('drop');
}
});
$('#dropableArea').sortable({accept: '.dragModule',connectWith: '#dropableArea',revert: true,});
$("#dropableArea").disableSelection();
});
我的问题是我要控制台console.log('drop');这是可放置的回调放置函数,它被调用了两次。
答案 0 :(得分:1)
这是jQuery UI的已知问题。当您在同一元素上使用droppable和sortable时,会发生此问题。在这里,您在同一元素droppableArea
上使用droppable和sortable
为了解决这个问题,请使用drop
的{{1}}方法来代替droppable
的{{1}}方法。两种情况在您的情况下都是相同的。
检查FIDDLE
recieve
如上更改代码,它将解决问题。请让我知道问题是否已解决
#UPDATE
您可以在可排序函数中添加以下代码
sortable