jQuery UI - 可拖动助手克隆体

Question

jQuery UI - 可拖动助手克隆体

jqueryjquery-uidrag-and-drop

5

感谢您预先查看此内容！

我的目标：

将对象拖放到艺术画布上后，必须在顶部的“工具栏”中保留对象的原始副本（或复制），以便用户可以重复使用它。
一旦拖动的对象被放置在艺术画布上，如果用户决定移动它，则需要使其始终可以沿着画布拖动。

现状：

（完成）成功克隆对象并将其放置在画布上。
一旦拖放，对象就不能再沿着画布拖动。我正在尝试找出如何使其保持可拖动状态。

克隆选项是创建可拖动对象的新实例的唯一方法，也许我想错了方向。

我是这样创建一个克隆的：

$(".objectDrag").draggable({
    helper:'clone'
});  

$("#artCanvas").droppable({
    accept: ".objectDrag",
    drop: function(event,ui){
        var new_smiley = $(ui.helper).clone();
        $(this).append(new_smiley );
    }
});

这是一个JSFiddle的链接，可以直观地展示正在发生的事情：http://jsfiddle.net/YRfVd/55/。如果我有任何不清楚的地方或需要进一步解释，请告诉我。再次感谢您花时间查看此内容 - 你们太棒了！Nathan

- Nathan_Sharktek

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Chitrang · Accepted Answer

您可以通过draggable()函数初始化克隆的拖动功能，并删除类objectDrag，以便新添加的对象不会开始创建它们自己的克隆。

$(".objectDrag").draggable({
    helper:'clone'
});  

$("#artCanvas").droppable({
    accept: ".objectDrag",
    drop: function(event,ui){
        var new_signature = $(ui.helper).clone().removeClass('objectDrag');
        new_signature.draggable();
        $(this).append(new_signature);
    }
});

JSFiddle: http://jsfiddle.net/YRfVd/56/