javascript - 防止掉落的元素落入已掉落的元素中

Question

那是一口。但是，问题就在这里。我有可以拖放到大 div 中的元素。这些元素是从原始元素克隆而来的。一切正常，除非用户不小心将拖动的元素放入已放置的元素中。我知道这最终会发生，而且结果是一团糟。我一直在寻找解决方案，但似乎找不到。

简单地说，需要一个解决方案来防止已删除的元素被删除到已删除的元素中。如果这样做了，拖动的 div 就会简单地移动到目标 div 的底部。我确信有一个简单的解决方案。我不可能是唯一一个遇到这个问题的人，如果这个问题已经得到解答……我真丢脸。

这是我当前的 JS:

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

function drag(ev) {
ev.dataTransfer.setData("div", ev.target.id);
var i = 0;
}

function drop(ev,el) { 
var newId = 'newaccount';

ev.preventDefault();
var data=ev.dataTransfer.getData("div");
var nodeCopy = document.getElementById(data).cloneNode(true);
nodeCopy.id = newId+i; 
nodeCopy.class = 'newaccount';
ev.target.appendChild(nodeCopy);
}

提前致谢。

Answer 1

我遇到了同样的问题，我所做的是，当一个div被删除时，我将它的id存储在一个变量中，并将其与上面的元素进行比较，例如

$('#'+idvariable).prevAll.each(function(){
$upperid= $(this).attr("id");
if(idvariable == upperid){
//do something
}
});

由于其他代码，它没有完全解决我的问题，但它可能适用于您的代码。