jQuery UI的拖拽效应

在一个面板我有所谓的资源，像一个黄色正方形，jQuery UI的拖拽效应

我想要的元素拖到另一个面板，并复制一个，但原来的一个还在那里，

标记非常简单：

<div id="panel"> 
     <div id="square" class="square"></div> //the resource 
    </div> 
    <div id="canvas"> 
    </div>

拖动的js代码：

$('#panel .square').draggable({ 
    appendTo: "#canvas", 
    helper: "clone" 
}); 

$('#canvas').droppable({ 
    drop: function (e, ui) { 
     var $temp_id = $(ui.draggable).attr('id'); 
     var $new_id = $temp_id + "_01"; 
     $(ui.draggable).clone() 
         .css({ 'top': ui.offset.top, 'left': ui.offset.left }) 
         .appendTo($(this)) 
         .attr('id', $new_id); 

     $('#'+$new_id+'').draggable(); 
    } 
});

我只想资源eleme NT可以复制自己，但是画布中的副本也可以复制自己！继承复制能力！

谢谢

这里example

我做了什么？为什么这会发生？我怎样才能取消呢？

来源

2012-03-11 hh54188

你有没有想过要从克隆的元素中删除.square？类似.attr（'id'，$ new_id）.attr（'class'，'square-no-drag'）; ？ – Ohgodwhy 2012-03-11 21:07:55

只需将其添加到您的放置事件。

ui.draggable.remove();

这将删除原始元素。

也为了防止您的项目的重复，考虑将其添加到您的可拖动。

accept: function(d) { 
     return $(this).find(d).length == 0 
}

它的功能是什么;它会检查您的容器是否存在对象d，如果该对象存在，则代码将为return false，从而防止导致重复的对象丢失。

希望这会有所帮助。

来源

2012-03-12 08:28:05 Drew

jQuery UI的拖拽效应

回答

相关问题