如何获取drag- and dropzone数据？

Question

我有一个正在运行的HTML5本机拖放页面，里面有几个div框和项目。当我将一个项目从一个框拖到另一个框中时，我想用ajax将项目和“新”框保存到mysql-database中。如何接收dropzone-box的号码？

先谢谢你，德克

<script>
function allowDrop(ev) {
ev.preventDefault();
}
function drag(ev) {
  ev.dataTransfer.setData("text", ev.target.id);
  ev.dataTransfer.clearData();
}

function drop(ev) {
  ev.preventDefault();
  var data = ev.dataTransfer.getData("text");
  ev.target.appendChild(document.getElementById(data));
  $.ajax({
      url:"update.php",
      method:"POST",
      data:{pid:data},
      success:function(data)
      {
       alert(data);
      }
    });
}
</script>

<div id="102" class="listx" data-zell="102" ondrop="drop(event)" ondragover="allowDrop(event)">
<div class="zellbox bgh"><strong>Box: 102</strong></div>
<div id="5" class=" item divider shaft" data-set="5" draggable="true" ondragstart="drag(event)"><span>First Name | S</span>
</div></div>

<div id="104" class="listx" data-zell="104" ondrop="drop(event)" ondragover="allowDrop(event)">
<div class="zellbox hfr"><strong>Box: 104</strong></div>
<div id="6" class=" item divider shaft" data-set="6" draggable="true" ondragstart="drag(event)">
<span>Theo Test | S</span>
</div></div>

我希望在警告框[pid]=>5 // this value I receive [box]=>104中显示以下内容

当我放下方框102中的一件物品时

Answer 1

Solved by mysql

function drop(ev, target) {
  ev.preventDefault();
  //    var data = ev.dataTransfer.getData("text");
  //    console.log(target.id + " : " + ev.target.id) 
  //    console.log(ev.dataTransfer.getData("text/html")); 
  //   console.log(ev.dataTransfer.getData("text")); 
      var data = ev.dataTransfer.getData("text");
      var tx= target.id;
  data=data+'#'+tx;
  $.ajax({
      url:"update.php",
      method:"POST",
      data:{pid:data},
      success:function(data)
      {
       window.location.reload(false);
      }
    });
}

<div id="list-200#x" class="listx " data-max="4" data-zell="200" ondrop="drop(event,this)" ondragover="allowDrop(event)">