如何禁用拖放可拖動div的拖放？

Question

我想創建一個div，它可以是draggable無處不在，但當我將它放在另一個div時，也無法再拖動它。

我找不到這個功能。我試過

$(".draggable").draggable({ helper: "clone" 

但沒有結果。

Answer 1

您可以在可拖動的div上捕獲dragstop事件，在該處理函數的內部可以刪除可拖動的功能。事情是這樣的：

$(".draggable").on("dragstop", function(event, ui) { 

    $(".draggable").draggable('destroy'); 

}); 

同樣，你也可以包括這在你的可拖動的div像這樣的初始化：

$(".draggable").draggable({ 
    stop: function(event, ui) { 
     $(".draggable").draggable('destroy'); 
    } 
}); 

如果只想當它裏面的另一個特定的div下降這樣的事情發生，不只是它的下跌的任何時間，那麼你就需要把這個代碼的處理程序中drop事件您可放開div中....

$(".droppable").droppable({ 
    drop: function(event, ui) { 
     $(".draggable").draggable('destroy'); 
    } 
}); 

或

$(".droppable").on("drop", function(event, ui) { 
    $(".draggable").draggable('destroy'); 
}); 

注：您可以通過更換實現同樣的功能：

$(".draggable").draggable('destroy'); 

與

$(".draggable").draggable('disable'); 

如果你打算用一個電話使您在將來再次可拖動：

$(".draggable").draggable('enable');