使用JavaScript将CSS应用于拖放区域中的活动拖放元素

我有几个可拖动的节点需要在拖放后高亮显示，只有被拖放的元素需要有边框。
我放下nodeA，它就会突出显示。稍后当我放下nodeB时，nodeB应该高亮显示，nodeA不应该高亮显示

这是我写的函数：

function drop(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    var nodeCopy = document.getElementById(data).cloneNode(true);
    test++;
    nodeCopy.id =test; /* We cannot use the same ID */
    var newNodeId= nodeCopy.id;
    ev.target.appendChild(nodeCopy);
    document.getElementById(newNodeId).className += " draggeddStyle";
}

---

我可以使用以下方法突出显示节点：

document.getElementById(newNodeId).className += " draggeddStyle;

---

之后，如果我拖动另一个节点，两个节点的样式都相同。

只需修改代码示例

function drop(ev) {
    ev.preventDefault();
    $(".draggeddStyle").removeClass("draggeddStyle");/* added this line */
    var data = ev.dataTransfer.getData("text");
    var nodeCopy = document.getElementById(data).cloneNode(true);
    test++;
    nodeCopy.id =test; /* We cannot use the same ID */
    var newNodeId= nodeCopy.id;
    ev.target.appendChild(nodeCopy);
    document.getElementById(newNodeId).className += " draggeddStyle";
}

---

我认为这是可行的。

您尝试了什么，突出显示代码在哪里？我可以使用“document.getElementById（newNodeId）.className+=“draggeddStyle；”这段代码..之后，如果我拖动另一个节点，两个节点都具有样式。因此，当您拖动第二个节点时，您需要从当前节点中删除该样式。由于我不熟悉该节点，因此无法实现该样式。。所以需要帮助：）在这个方法的开头，首先尝试删除现有元素的类名$（“.draggeddStyle”）.removeClass（“draggeddStyle”）；这应该是代码中方法的第一行。希望能奏效。