Javascript 如何将节点从一个列div拖动到另一个列div

我已经尽了最大努力去寻找有类似问题的人，虽然他们在那里，但他们不符合我需要做的。因此，我无法通过阅读他们的答案来解决我的问题。在过去的5个小时里，我花了后半部分的时间来做这件事，我知道了很多我需要做的事情，但我最终遇到了一个我无法解决的问题

用例是我将动态构建一个“列”。我希望能够将项目从A列拖到B列（反之亦然）。将项目拖动到另一列后，应将其从原始列中删除

---

是指向JSFIDLE页面的链接，该页面包含我测试的代码。因为它现在正处于工作状态，一次就完全可以正常工作。当我第二次尝试使用它时，什么也没发生。我能说的最好的是“handleDragStart”事件侦听器没有第二次触发；因此，当从ASP.Net Web表单加载时，当我尝试移动第二项时，浏览器客户端出现以下错误：

Uncaught DOMException:未能在“Element”上设置“outerHTML”属性：此元素没有父节点。

请看，我只发布了所需的代码

功能allowDrop（ev）{
ev.preventDefault（）；
}
功能阻力（ev）{
ev.dataTransfer.setData（“文本”，ev.target.id）；
}
功能下降（ev）{
ev.preventDefault（）；
var elementId=ev.dataTransfer.getData（“文本”）；
ev.target.appendChild（document.getElementById（elementId））；
}

.column{
宽度：75px；
最小高度：50px；
背景色：#6772E5；
颜色：#FFF；
填充：8px 12px；
边界：0；
边界半径：4px；
字号：1em；
}

解锁
A.
B
锁定
C
D

谢谢！你是个救生员。在我测试它之前我读过它，我不认为它会按照我想要的方式工作。在我看来，您必须从一个节点删除节点，然后将其添加到另一个节点。我不明白为什么它有效，但它有效！谢谢：DIt之所以有效，是因为appendChild将元素移动到新容器中，而不仅仅是复制它。签出所以我发现了一个很容易修复的bug，只是想发布它，以防将来有人偶然发现它。您的示例允许您将一个“obj”拖到另一个“obj”上。修复是检查电动汽车的元素下降，超级容易。再次感谢！