drop draggable div剛剛確認對話框消息

Question

我有一個.drag div，當我把這個div放在.drop div裏時.drag div被刪除。

但我只想刪除.drag div，如果用戶在對話框消息中單擊「ok」。我試圖在drop:function(event,ui){...}中這樣做，但它不起作用。

你看到如何解決這個問題嗎？

我這裏的例子，即時通訊工作：http://jsfiddle.net/8t9v5tpq/12/

$(".drag").draggable({ 
    revert: 'invalid', 
    drag: function(event, ui) {  
    }  
}); 

$('.drop').droppable({ 
}); 

drop: function(event, ui) { 
    $("#dialog").dialog({ 
     autoOpen: false, 
     modal: true, 
     buttons : { 
     "Confirm" : function() { 
      alert("You have confirmed!"); 
      ui.draggable.remove(); 
     }, 
     "Cancel" : function() { 
      $(this).dialog("close"); 
      // revert the element to original position 
     } 
     } 
     e.preventDefault(); 
     $("#dialog").dialog("open"); 
    } 

Answer 1

該解決方案採用的是原生確認對話框：

$(".drag").draggable({ 
    revert: 'invalid', 
    drag: function(event, ui) { 

    } 

}); 

$('.drop').droppable({ 
    tolerance: "pointer", 
    accept: ".drag", 
    drop: function(event, ui) { 
     if (!confirm("Are you sure?")) 

      ui.draggable.css({ 
      top: 0, 
      left: 0 
     }); 
    } 
}); 

live example