Jquery drag n drop photo editor with clone on parent container

Question

Я пытаюсь внедрить систему управления баннерами и планировал использовать jquery Photo Manager. Проблема, с которой я сейчас сталкиваюсь, заключается в том, что я не могу заставить родительский образ клонировать основной контейнер.

Вот ссылка на скрипку для codes (Это в основном то же самое с сайта JQuery UI)

То, что я намерен создать, чтобы позволить пользователям перетаскивать или добавить изображение из левой и пользователи могут добавлять одно и то же изображение несколько раз, но как только изображение добавляется вправо, оно исчезает слева.

Я рассматривал этот кусок кода для решения, но не вижу удаления элементов DOM, специфичных для перемещаемого элемента. значки - только элементы, удаленные из DOM.

function deleteImage($item) { 
    $item.fadeOut(function() { 
     var $list = $("ul", $trash).length ? $("ul", $trash) : $("<ul class='gallery ui-helper-reset'/>").appendTo($trash); 
     $item.find("a.ui-icon-trash").remove(); 
     $item.append(recycle_icon).appendTo($list).fadeIn(function() { 
      $item.animate({ 
       width: "48px" 
      }) 
       .find("img") 
       .animate({ 
       height: "36px" 
      }); 
     }); 
    }); 
} 

Может кто-нибудь помочь мне с объяснением.

Заранее спасибо.

Answer 1

Фактически с помощью jquery .clone() функция сделала трюк. Все, что мне нужно было сделать, это не передавать объект элемента, я передавал их клоны с событиями.

$trash.droppable({ accept: "#gallery > li", activeClass: "ui-state-highlight", drop: function (event, ui) { deleteImage(ui.draggable.clone(true)); } });

установки параметра в True для клона, делает глубокую копию элемента, включая все события.

$("ul.gallery > li").click(function (event) { var $item = $(this), $target = $(event.target); if ($target.is("a.ui-icon-trash")) { deleteImage($item.clone(true)); } else if ($target.is("a.ui-icon-zoomin")) { viewLargerImage($target); } else if ($target.is("a.ui-icon-refresh")) { $item.remove(); } return false; });

Вот ссылка на рабочую скрипку для справки. Link