jquery - jQuery UI 在拖放时获取可拖动 div 中元素的属性：

Question

$('#drop_area').droppable({
    accept: '.draggable',
    drop: on_element_drop
});

function on_element_drop(event, ui){

}

<div class="draggable">
    <img src="test.png" alt="3">
</div>

我试图弄清楚如何从传递给“on_element_drop”的“ui”参数中获取这个可拖动 div 中图像的“alt”属性。有人知道怎么做吗？

我似乎得到的最接近的是：

ui.helper.context.children[0].attr('alt');

但是这不起作用。

Answer 1

ui.draggable.find("img").attr("alt")

http://jsfiddle.net/3SfBJ/2

Answer 2

Your draggable div contain only one img element. So for this below is right

 ui.draggable.find("img").attr("alt")
                  OR
 ui.draggable.children("img").attr("alt")

But if your draggable contain more img element like below

<div class="draggable">
    <img src="test.png" alt="3">
    <img src="test.png" alt="4">
</div>

then you can't use upper code to find alt value of second img element. So you can try this:

ui.draggable.find("img:last-child").attr("alt")
                   OR
ui.draggable.children("img:last-child").attr("alt")

This example shows a general idea that how you can find actual object within parent object. You can use classes to differentiate your child object. That is easy and fun. i.e.

<div class="draggable">
    <img class='first' src="test.png" alt="3">
    <img class='second' src="test.png" alt="4">
</div>

You can do this as below :

ui.draggable.find(".first").attr("alt")

and more specific as:

ui.draggable.find("img.first").attr("alt")

You can use find or children as above code. For more visit Children http://api.jquery.com/children/ and Find http://api.jquery.com/find/.

Answer 3

我假设您发布的内容还有更多的 html 和 javascript？像可放置的 div 一样吗？

您应该能够将其添加到您的放置处理程序

ui.draggable.children(0).attr('alt')

如果添加额外的 html，使用 find 也可以

ui.draggable.find('img').attr('alt');

祝你好运！