Клонирование перетаскиваемого Jquery также перетаскивает его оригинал.

Question 1

Я создаю инструмент разработки генератора активности. Пользователь, используя контекстное меню, может выбрать добавление ряда элементов на страницу, а некоторые из них заполнить текстом.

Используя Jquery UI, все элементы можно перетаскивать, а некоторые из них можно изменять. Я хочу, чтобы пользователь мог сделать точную копию элемента, но когда я использую функцию клонирования, я получаю странные результаты. Я могу перетащить оригинал из клона, но когда я пытаюсь перетащить клон, он просто перетаскивает оригинал и остается на своем месте.

Вот мой код

    function addobject (element_type){
       $('#activitystage').append($("<div class=\"draggable " + element_type + "\" id=\"" + counter + "\"></div>")); 
       $( "#" + counter ).multidraggable({ containment: "#activitystage",  grid: [10, 10],drag: function(event,ui){ showpositions(); }});   
       $('#' + counter).contextMenu({menu: 'functionsMenu'  }, function(action, el, pos) {run(action, el);  });
       $('#' + counter).append("<textarea class=\"" + element_type + "\"></textarea>");
    }

    function run (action, el){
       switch (action){
            case "clone":
              $(el).clone(true).attr('id', 'some new id').appendTo('#activitystage');
              break;
}

jquery clone draggable

2

Nuevallorker 16 Ноя 2011 в 19:52

Вы пытались повторно использовать функцию многократного перетаскивания на клонированном div?

–

max4ever

16 Ноя 2011 в 19:58

Какую версию jQuery вы используете?

–

Abe Miessler

16 Ноя 2011 в 20:33

Кроме того, если counter является числом, то у вас недопустимый HTML. Идентификаторы не могут начинаться с цифры.

–

Abe Miessler

16 Ноя 2011 в 20:35

Я использую jquery 1.5, jquery ui 1.8. Не знал, что ID нельзя начинать с цифры, спасибо. Пробовал повторно применять multidraggable, но это не помогло

–

Nuevallorker

17 Ноя 2011 в 12:44

1

Если вы клонируете объект, обычно делается неглубокая копия. Любые свойства, которые являются ссылками на другие переменные, останутся ссылками. Вы должны установить перетаскивание на новый объект

–

Jeroen

7 Июл 2012 в 23:22

Answer

Самое простое решение вашей проблемы, которое я могу придумать, - это просто использовать clone (false) и повторно привязать событие перетаскивания.

Попробуйте этот код

var attr = { containment: "#activitystage",  grid: [10, 10],drag: function(event,ui){ showpositions(); }};

function addobject (element_type){
    $('#activitystage').append($("<div class=\"draggable " + element_type + "\" id=\"" + counter + "\"></div>")); 
    $( "#" + counter ).multidraggable(attr);   
    $('#' + counter).contextMenu({menu: 'functionsMenu'  }, function(action, el, pos) {run(action, el);  });
    $('#' + counter).append("<textarea class=\"" + element_type + "\"></textarea>");
}

    function run (action, el){
       switch (action){
            case "clone":
              $(el).clone(false).attr('id', 'some new id').appendTo('#activitystage').multidraggable(attr);
              break;
}

0

roacher 25 Окт 2012 в 17:05

Question 2

Самое простое решение вашей проблемы, которое я могу придумать, - это просто использовать clone (false) и повторно привязать событие перетаскивания.

Попробуйте этот код

var attr = { containment: "#activitystage",  grid: [10, 10],drag: function(event,ui){ showpositions(); }};

function addobject (element_type){
    $('#activitystage').append($("<div class=\"draggable " + element_type + "\" id=\"" + counter + "\"></div>")); 
    $( "#" + counter ).multidraggable(attr);   
    $('#' + counter).contextMenu({menu: 'functionsMenu'  }, function(action, el, pos) {run(action, el);  });
    $('#' + counter).append("<textarea class=\"" + element_type + "\"></textarea>");
}

    function run (action, el){
       switch (action){
            case "clone":
              $(el).clone(false).attr('id', 'some new id').appendTo('#activitystage').multidraggable(attr);
              break;
}

0

roacher 25 Окт 2012 в 17:05

Клонирование перетаскиваемого Jquery также перетаскивает его оригинал.

1 ответ

Похожие вопросы

Новые вопросы

jquery