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

您的可拖动div只包含一个img元素。所以对于以下是正确的

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

但是如果你的draggable包含更多img元素，如下面的

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

然后你不能使用上层代码来找到第二个img元素的alt值。所以你可以试试这个：

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

此示例显示了如何在父对象中查找实际对象的一般概念。您可以使用类来区分子对象。这很简单有趣。即。

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

您可以按照以下方式执行此操作：

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

更具体如下：

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

您可以使用上述代码中的find或children。如需更多信息，请访问儿童http://api.jquery.com/children/和查找http://api.jquery.com/find/。

Answer 3

我假设有更多的html和javascript与你发布的内容一致？像droppable div一样？

您应该可以将此添加到您的放置处理程序

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

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

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

祝你好运！

jQuery UI在drop中的draggable div中获取元素的属性：

3 个答案: