html拖放不同的项目

我有一个拖放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>

星期一
星期二

---

它可以很好地处理第一个元素，但是当我尝试拖放第二个元素时，它会一直拖放第一个元素。我还对多个项目进行了测试：当我拖动任何项目时，只有第一个项目会掉落？

这可能是因为您有两个ID相同的元素：

drag1

。您应该避免给元素提供相同的ID

Merci bcp Laszlo先生