Jquery drop drop方法的回調調用兩次

Question

我有一個視圖，下面的事件。查看ID是「folders-block」。 我的元素是觀是這樣的：

<ul> 
    <li></li> 
    <li></li> 
    <li></li> 
</u> 
<ul> 
    <li> 
     <ul></ul> 
    </li> 
    </ul> 

下面是骨幹事件。

events{ 
    "mousedown .all-folders": "dragCustomFolders" 
    }, 
    dragCustomFolders: function(e){ 
    $('#folders ul li').draggable({ 
     cursor: 'move', 
     drag: this.dragElement, 
     revert: "invalid" 
    }); 

    $('#folders li').droppable({ 
     drop: this.cardDrop, 
    }); 
    } 

當我將li從一個ul拖到另一個ul時，只會調用一次ul。當我將li元素拖放到同一個ul元素中的另一個li元素時，drop回調函數被調用兩次。

如何解決這個問題。

Answer 1

嘗試設置greedy選項爲true可放開定義：

默認情況下，當一個元素被嵌套droppables下降，每 可放開將收到的元素。但是，通過將此選項設置爲 true，任何父級可放置元素都不會收到元素。下降 事件仍然會正常冒泡，但是可以檢查event.target 以查看哪個droppable收到可拖動元素。

代碼：

$('#folders li').droppable({ 
    drop: this.cardDrop, 
    greedy: true 
});