JQuery перетаскивание - как добраться до элемента, перетаскиваемого

Я использую библиотеку jQuery для реализации перетаскивания.

Как мне получить элемент, который перетаскивается при его удалении?

Я хочу получить идентификатор изображения внутри div. Следующий элемент перетаскивается:

<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").droppable({
                 accept: ".block",
                 activeClass: 'droppable-active',
                 hoverClass: 'droppable-hover',
                 drop: function(ev, ui) { }
});

Я пробовал различные ui.id и т.д., которые, похоже, не работают.

Ответы

Ответ 1

Разве это не ui.draggable?

Если вы пойдете сюда (в Firefox и предположим, что у вас есть firebug) и посмотрите в консоль firebug, вы увидите, что я делаю console.dir объекта ui.draggable, который перетаскивается 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)  
       }

Ответ 2

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

...

Ответ 3

Теперь ui.draggable() больше не работает. Для получения идентификатора можно использовать

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

Ответ 4

Я пробовал больше всего, но в конце концов только

event.target.id

работал у меня.

Ответ 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(). Для обнаружения того, что объект draggable был удален в droppable(), работает следующее:

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

Ответ 6

redquare прав, внутри вашей функции обратитесь к ui.draggable:

$(".drop").droppable({ accept: ".block", 
                       activeClass: 'droppable-active', 
                       hoverClass: 'droppable-hover', 
                       drop: function(ev, ui) { 
                           //do something with ui.draggable here
                       }
});

Это свойство указывает на перетаскиваемую вещь.

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

Ответ 7

я получил

drop: function( event, ui ) {alert(ui.draggable.attr("productid"));}