可排序滴處理程序不會被調用和刪除太快

Question

JSFiddle Source

如果您將真正快速回落，從源列表框中的項目到目的地列表框，然後滴處理程序不火。

我已經在FF 10，Chrome 17和IE 9中測試過，結果相同。

要測試它，請將項目從左邊的列表框拖到右邊的列表框中。您會看到一個複選框已被添加到該項目一旦下降。另外，日誌輸出到控制檯。

但是，如果您真的很快拖放，您將看不到複選框和日誌。您可能需要嘗試幾次才能看到問題。

因此，似乎事件發射，傳播或捕捉過程中存在滯後。任何想法發生了什麼？

我試過div和span標籤，並得到相同的結果。

Answer 1

所以我剛剛檢查了你的問題，發生了什麼是你正在移動鋰在正確的UL，但你在正確的UL以外的地方放下鋰，它回到正確的一個，而不是左側一個，但由於你沒有把它放在正確的ul內，所以drop事件不會被觸發。

退房以下（解答）問題進行了類似的問題：https://stackoverflow.com/questions/7775769/sortable-and-droppable-issue-returning-to-original-sortable-list

你有兩種選擇，以解決這個問題：創建sortables時要取出connectWith選項，並繼續使用droppables，或保持connectWith和使用接收來自可排序事件：

$(function() { 
    // make the two list boxes sortable   
    $('#source, #destination').sortable({ 
     connectWith: $('ul') 
    }); 

    // when an item is dropped on destination list box (right one), 
    // a checkbox is added to it 
    $('#destination').bind("sortreceive", function(e, ui) { 
     var label = $(ui.item[0]).text(); 
     console.log(label + ' dropped to destination list box'); 
     $(ui.item[0]).remove(); 
     $(this).append('<li><label><input name="categories[]" type="checkbox" /> '+ label +'</label></li>'); 
    }); 

    // when an item is dropped on the source list box (left one), 
    // the checkbox is remove 
    $('#source').bind("sortreceive", function(e, ui) { 
     var label = $(ui.item[0]).text(); 
     $(ui.item).remove();    
     $(this).append('<li>' + label + '</li>'); 
    }); 
});​