Question

图像托盘中的图像应该在托盘中，即使它被拖放到第一个/第二个div中。但是一旦我将它放在第一个/第二个div中，它就会消失。我希望图像即使被拖动也会出现在托盘中。有人可以帮忙吗？

Firtst input div<div class="div1"  ondrop="drop(event)" ondragover="allowDrop(event)"></div>

<br>

second input div<div class="div1"  ondrop="drop(event)" ondragover="allowDrop(event)"></div>

Image tray<img id="drag1" src="https://www.google.com/images/srpr/logo3w.png" draggable="true" ondragstart="drag(event)" width="336" height="69">

的Javascript

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

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

function drop(ev) {
  ev.preventDefault();
  var data = ev.dataTransfer.getData("text");
  ev.target.appendChild(document.getElementById(data));
}

请找到我的作品@ JSFIDDLE

Answer 1

您可以克隆该元素，请参阅https://jsfiddle.net/bgwzvoj1/1/

function drop(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");

    ev.target.appendChild(document.getElementById(data).cloneNode());
}

cloneNode

Jquery拖放图像但原始/源图像丢失

1 个答案: