拖动一个图像的副本不会在另一个上面拖动

Question

我使用标准的javascript代码进行拖放并将其修改为在拖放区域拖动图像的副本。我无法弄清楚，因为我什么也没有关于JavaScript，是为了替换/交换掉落的图像时，我拖动另一个顶部它。请帮助!!我真的很感激它！我使用了下面的代码，我更喜欢当前代码是否有解决方法，如果没有，有没有简单的方法来解决这个问题？非常感谢！

function allowDrop(ev) { 
ev.preventDefault(); 
} 

function drag(ev) { 
ev.dataTransfer.setData("Text", ev.target.id); 
} 

function dragEnter(ev) { 
ev.preventDefault(); 
} 

function drop(ev) { 
var data = ev.dataTransfer.getData("Text"); 
ev.target.appendChild(document.getElementById(data).cloneNode(true)); 

ev.preventDefault(); 
} 

Answer 1

在这种Fiddle
当你拖放区域上落区拖动图像（在DX蓝格）如果有这个图像消失的新的拖累图像显示的图像
您所需要的jQuery代码是

<script> 
    $(document).ready(function(){ 
     $('.dr').on("dragstart", function (event) { 
       var dt = event.originalEvent.dataTransfer; 
       dt.setData('Text', $(this).attr('id')); 
      }); 

     $('#dropArea').on("dragenter dragover drop", function (event) { 
      event.preventDefault(); 
      if (event.type === 'drop') { 
       $(this).find('.dr').remove() 
       var data = event.originalEvent.dataTransfer.getData('Text',$(this).attr('id')); 
       de=$('#'+data).clone(); 
       de.css({'position':'absolute','top':0+'px','left':0+'px'}).appendTo($(this)); 
      }; 
     }); 
    }); 
</script> 

为此结果我使用拖放API a html5