Несколько Draggables Найти X и Y позиции

Question

Несколько Draggables Найти X и Y позиции

0

Привет, Я создаю прототип, который позволит пользователю создавать несколько DIV. После создания DIV он должен быть перетаскиваемым, после его сброса он должен отображать позицию x и y в DIV.

Проблема в том, что как только я создал несколько DIV, их можно перетащить и сбросить, но все они отображают положение первого DIV.

http://jsfiddle.net/aX92L/

JQuery

$(function () {
    $("#add").click(function () {
        $("body").append('<div class="note"><p>note</p></div>');
        $(".note").draggable();
        $("body").droppable({
            accept: '.note',
            activeClass: 'ui-state-hover',
            hoverClass: 'ui-state-hover',
            drop: function (event, ui) {
                var position = $(".note").position();
                $(".note").text("left: " + position.left + ", top: " + position.top);

            }
        });
    });
});

Если кто-то может помочь, это будет очень признательно.

Chris Cowan 02 дек. 2013, в 16:16

Источник

Теги:

jquery

jquery-ui

position

jquery-ui-droppable

jquery-draggable

1 ответ

Ещё вопросы

Spokey · Accepted Answer · 2013-12-02T13-20-00.000Z

Использовать ui.helper

$(function () {
    $("#add").click(function () {
        $("body").append('<div class="note"><p>note</p></div>');
        $(".note").draggable();
        $("body").droppable({
            accept: '.note',
            activeClass: 'ui-state-hover',
            hoverClass: 'ui-state-hover',
            drop: function (event, ui) {
                var position = $(ui.helper).position();
                $(ui.helper).text("left: " + position.left + ", top: " + position.top);

            }
        });
    });
});