Drag and drop (replace) in HTML 5

狂风中的少年 提交于 2020-01-14 03:17:07

问题


i have menu from where can drag elements and drop into another div, it works. But how i can do the replacement of elements??

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

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

function OnDragEnter (){
}
function drop(ev) { 
    ev.preventDefault();
    var data = ev.dataTransfer.getData("text");
    var nodeCopy = document.getElementById(data).cloneNode(true);
    nodeCopy.id = "newId";
    ev.target.appendChild(nodeCopy);
}

回答1:


Try this:

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");
    ev.target.removeChild(ev.target.childNodes[0]);
    ev.target.appendChild(document.getElementById(data));
}


来源:https://stackoverflow.com/questions/27089260/drag-and-drop-replace-in-html-5

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!