Question

我有一个拖放式html5函数，该函数运行良好：

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));
}

所以我将其设置在两个元素上，可以说这两个：

    <div id="div1" id="drag1" draggable="true" ondragstart="drag(event)"> 
      <h3> Monday </h3> 
    </div>
    <div id="div1" id="drag1" draggable="true" ondragstart="drag(event)"> 
      <h3> Tuesday </h3> 
    </div>

它在第一个元素上工作正常，但是当我尝试拖放第二个元素时，它会一直删除第一个元素。我还对多个项目进行了测试：拖动任何项目时，只有第一个项目会掉落？

Answer 1

这可能是因为您有两个具有相同ID的元素：drag1。您应该避免为元素赋予相同的ID

html拖放不同的项目

1 个答案: