首页 > 解决方案 > 新的 HTML 元素不适用于拖放功能

问题描述

我有一个接受放置功能的初始 div 标签。现在在这个标签中我创建了新的 div 标签,它也应该接受相同的 drop 功能。但它不起作用。新创建的 div 标签也应该能够在其中创建新的子 div 标签。

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

function drag(ev) 
{
  ev.dataTransfer.setData("text", ev.target.id);
}

function drop(ev) 
{
  ev.preventDefault();
  var data = ev.dataTransfer.getData("text"); // ID of the incoming dragged             element


  if(ev.target.childElementCount==0)
  {
    ev.target.appendChild(document.getElementById(data));
    for(var i=0;i<func_list[parseInt(data)].length;i++)
    {
        var exp=document.createElement("div");
        exp.setAttribute("id", data.concat("exp"));
        exp.setAttribute("ondrop","drop(event)");
        exp.setAttribute("ondragover","allowDrop(event)");
        exp.setAttribute("class","Expression_Area");
        ev.target.appendChild(exp);
    }
  }

  else
  {
      var item = ev.target;
      while (item.firstChild) 
      {
        item.removeChild(item.firstChild);
      }
      ev.target.appendChild(document.getElementById(data));
    for(var i=0;i<func_list[parseInt(data)].length;i++)
    {
        var exp=document.createElement("div");
        exp.setAttribute("id", data.concat("exp"));
        exp.setAttribute("ondrop","drop(event)");
        exp.setAttribute("ondragover","allowDrop(event)");
        exp.setAttribute("class","Expression_Area");
        ev.target.appendChild(exp);
    }

  }



}

标签: javascripthtml

解决方案


推荐阅读