還原拖拽位置

Question

我在我的代碼中使用拖拽和拖拽jquery ui。代碼工作正常。但用戶應該有一些保存後編輯數據的能力。這意味着我需要在用戶再次打開頁面時恢復拖動和拖動位置。我嘗試使用觸發器，但我無法模擬「drop ui」我該怎麼做？

$(".draggable-children-username").draggable({ 
    snap: ".draggable-in-box", 
    opacity: 0.7, 
    revert: 'invalid', 
    helper: "clone" 
}); 
$(".draggable-in-box").droppable({ 
    accept: $(".draggable-children-username"), 
    hoverClass: "dropHover", 
    drop: function (ev, ui) { 
     $(this).trigger("DopeEvent", ui); 
    } 
}); 

$(".draggable-in-box").bind("DopeEvent", function(event, ui){ 
    console.log(ui); 

    var me = ui.draggable.clone() 
    ui.draggable.draggable("disable") 
    me.appendTo(this) 
    .addClass("newClass"); 
    me.draggable({ 
     accept: ".draggable-in-box", 
     revert: function(valid) { 
      if(!valid) { 
       this.remove(); 
       $(".dr-children-id-"+this.attr("data-id")).draggable("enable"); 
      } 
     } 
    }); 
}); 

$(".draggable-in-box").trigger("DopeEvent", $(".dr-children-id-140")); 

當前錯誤：未捕獲的類型錯誤：ui.draggable.clone不是一個函數

http://jsfiddle.net/vjGY4/123/

Answer 1

一些修正。工作實例的什麼，我認爲你正在試圖做的：

http://jsfiddle.net/Twisty/vjGY4/125/

JQuery的

$(".draggable-children-username").draggable({ 
    snap: ".draggable-in-box", 
    opacity: 0.7, 
    revert: 'invalid', 
    helper: "clone" 
}); 

$(".draggable-in-box").droppable({ 
    accept: $(".draggable-children-username"), 
    hoverClass: "dropHover", 
    drop: function(ev, ui) { 
    $(this).trigger("DopeEvent", ui.draggable); 
    } 
}); 

$(".draggable-in-box").bind("DopeEvent", function(event, ui) { 
    console.log(ui); 

    var me = $(ui).clone(); 
    //ui.draggable.draggable("disable") 
    me.appendTo(this) 
    .addClass("newClass"); 
    me.draggable({ 
    accept: ".draggable-in-box", 
    revert: function(valid) { 
     if (!valid) { 
     this.remove(); 
     $(".dr-children-id-" + this.attr("data-id")).draggable("enable"); 
     } 
    } 
    }); 
}); 

$(".draggable-in-box").trigger("DopeEvent", $(".dr-children-id-140")); 

1. 不要假設你正在傳遞一個拖動對象或一個jQuery對象你DopeEvent。使用var me = $(ui).clone();
2. 在你drop，你需要傳遞的元素，像這樣：$(this).trigger("DopeEvent", ui.draggable);

希望有所幫助。您可以通過檢查傳遞的內容來改善事件。像if(typeof ui === "object"){}可以工作。