訪問jQuery UI中的可拖動項目

Question

我已經構建了一個將圖像拖動到「保存區域」的界面，我不知道如何訪問實際的html標記 - 例如img src標記？

我有這個

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

我該用什麼來訪問圖片src？

<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'); 
}