html5拖放的工作流程

Question

我在使用拖放时感到困惑。到目前为止，它可以拖放一个元素。但是，我想在完成drop之后存储结构，所以我将删除的目标添加到其父级中，这是在drop之后，我发现ondragend每次调用两次，并且ondrop在目标元素的数量上调用base 。如何实现？

function drop(){
  //this function is called base on the numbers of target element
  //drop third into first/second will be called once
  //drop second into first and then drop third into second will be called twice
}
function over(){
  //this function is called base on the numbers of total affected element
  //drop third into first/second will be called twice
  //drop second into first and then drop third into second will be called thrice
}
<div ondrop=drop ondragend=over id="first"></div>
<div ondrop=drop ondragend=over id="second"></div>
<div draggable=true id="third"></div>

另外我在drop和over中使用return false也无法修复问题