Пользовательский интерфейс jQuery получает свойство элемента в перетаскиваемом div по капле: - PullRequest
Новая
       20

Пользовательский интерфейс jQuery получает свойство элемента в перетаскиваемом div по капле:

2 голосов
/ 24 июня 2011 
$('#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>

Я пытаюсь выяснить, как я могу получить свойство 'alt' изображения в этом перетаскиваемом элементе div из аргумента 'ui', переданного в 'on_element_drop.' Кто-нибудь знает, как это сделать?

Самое близкое, что мне кажется: 

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

однако это не работает.

Ответы [ 3 ]

5 голосов
/ 24 июня 2011 
ui.draggable.find("img").attr("alt")

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

2 голосов
/ 22 марта 2013

Ваш перетаскиваемый div содержит только один элемент img. Так что для этого ниже правильно 

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

Но если ваш перетаскиваемый элемент содержит больше элемента img, как показано ниже 

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

тогда вы не можете использовать верхний код для поиска альтернативного значения второго элемента img. Так что вы можете попробовать это: 

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/.

1 голос
/ 24 июня 2011

Я предполагаю, что есть больше html и javascript, чтобы идти с тем, что вы опубликовали?Как DROPBABLE DIV?

Вы должны быть в состоянии добавить это в свой обработчик капель 

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

Использование поиска также, если вы добавите дополнительный HTML 

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

Удачи!

...