доступ к перетаскиваемым элементам в jquery ui

Question

У меня есть интерфейс для перетаскивания изображений в «область сохранения», и я не знаю, как получить доступ к фактической разметке html, такой как тег img src?

у меня есть этот

$(function(){ 
     $('.draggable').draggable(); 
     $('#droparea').droppable({ 
      drop: function(ev,ui) { 
       //do magic 
      }, 
      out: function(event, ui){ 
       removeone();    
      } 
     }); 
    }); 

, что я могу использовать, чтобы получить доступ к СРК изображения?

<img border="0" src="http://bla.png" class="draggable ui-draggable" style="position: relative;"> 

У меня есть несколько сотен изображений. Что я должен делать, когда они упадут, я могу получить доступ к src?

Answer 1

Working demo

В функции перетаскивания, вы получаете доступ к объекту с "ui.draggable":

Например:

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

Он передает объект Jquery к функции "processImage" , Там вы можете получить доступ к свойствам изображения двух способов:

1.-Как объект Jquery: $ item.attr ("SRC")

2.-Или как элемент DOM: $ пункта. получить (0) .src

function processImage($item) 
{ 
alert($item.attr("src")); 
} 

конечно, вы можете избавиться от функции "processImage", и доступ непосредственно к объекту, как:

ui.draggable.attr("src") 

или

ui.draggable.get(0).src 

Answer 2

Вы можете получить к нему доступ с помощью параметра ui.

drop: function (ev, ui) { 
    var image_source = ui.helper.attr('src'); 
}