jQuery拖放 - 如何获取被拖动的元素

Question

我正在使用jQuery库来实现拖放.

如何删除被删除的元素？

我想在div中获取图像的id.拖动以下元素:

<div class="block">
    <asp:Image ID="Image9" AlternateText="10/12/2008 - Retina" Width=81 Height=84 ImageUrl="~/uploads/ImageModifier/retina.jpg" runat=server />
</div>

我从他们的例子中得到了标准的drop函数:

$(".drop").droppable({
                 accept: ".block",
                 activeClass: 'droppable-active',
                 hoverClass: 'droppable-hover',
                 drop: function(ev, ui) { }
});

我尝试过各种ui.id似乎不起作用的等等.

Answer 1

是不是ui.draggable？

如果你去这里(在Firefox中并假设你有firebug)并查看firebug控制台,你会看到我正在做一个ui.draggable对象的console.dir,这是被拖动的div

http://jsbin.com/ixizi

因此,drop函数中需要的代码是

       drop: function(ev, ui) {
                 //to get the id
                 //ui.draggable.attr('id') or ui.draggable.get(0).id or ui.draggable[0].id
                 console.dir(ui.draggable)  
       }

Answer 2

$(ui.draggable).attr("id")    

...

Answer 3

ui.draggable()似乎不再起作用了.要获得id可以使用

$(event.target).attr("id");

Answer 4

我尝试了上面的大部分内容,但最终只是

event.target.id

为我工作.

Answer 5

回答2017年的工作

很多时间过去了,我发现当前接受的答案不再适用.

目前有效的解决方案:

$('#someDraggableGroup').draggable({
                helper: 'clone',
                start: function( event, ui ) {
                    console.log(ui.helper.context)
                    console.log(ui.helper.clone())
                }
            })

这里,ui.helper.context指的是您尝试拖动的原始对象,并clone()引用克隆版本.

编辑

以上也是看你使用该draggable()函数拖动的对象.为了检测draggablea中丢弃了什么对象droppable(),以下工作:

$('#myDroppable').droppable({
    drop: function(event, ui){
        console.log(ui.draggable.context)
                 OR
        console.log(ui.draggable.clone() )
    }
})