jQuery動態拖拽

Question

我在拖放時遇到了一些麻煩。如果我把靜態字段...它的工作正常，但如果我動態創建，可拖動不起作用。

jQuery的

$(function() { 
    $("#drag_item #data li").draggable({ 
     helper: "clone" 
    }); 
    $("#drag_item ol").droppable({ 
     drop: function(event, ui) { 
      $(this).find(".placeholder").remove(); 
      $("<li></li>").text(ui.draggable.text()).appendTo(this); 
     } 
    }).sortable({ 
     items: "li:not(.placeholder)", 
     sort: function() { 
      $(this).removeClass("ui-state-default"); 
     } 
    }); 
}); 

靜態HTML

<div id="drag_item"> 
    <ul id="data"> 
     <li>A</li> 
    </ul> 
</div> 

Dinamically

function create_item() { 
    for (var a = 0; a < data_array.length; a++) { 
     $("<li></li>").text('Data'+a).appendTo($('#data')); 
    } 
}); 

任何線索？

Answer 1

每次在節點中進行更改時，都需要應用.draggable。例如：

function create_item() { 
    for (var a = 0; a < data_array.length; a++) { 
     $("<li></li>").text('Data'+a).appendTo($('#data')); 
    } 

    $("#data").draggable("destroy"); 
    $("#drag_item #data li").draggable({ 
     helper: "clone" 
    }); 
});