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