0

我正在使用 html5 拖放来设置 div 被丢弃的一些值，但是有一些奇怪的行为，我无法理解，也无法找到解决方案。

例如，如果我在位置 1,6,11,16（在对角线上）添加元素，您会看到在位置 2,3,4 上div和input在td中被删除。为什么？

例如，如果我尝试将元素从位置 1 克隆到位置 2，那么类将获得值“ typeA-1 ”；当然那里有一个计数器，但只针对 id 而不是针对类，那么为什么类会获得计数器值呢？

这是 jsFiddle http://jsfiddle.net/SHLW3/1/上的代码

谢谢

var counter = 1;
function allowDrop(ev)  {
    ev.preventDefault();
}

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

function clone(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("Text");
    var original = document.getElementById(data);
    var set = document.getElementById("empty");
    set.firstElementChild.setAttribute("value", data);
    set.setAttribute("id", data+"-"+(counter++));
    set.setAttribute("class", data);
    set.setAttribute("draggable", "true");
    set.setAttribute("ondragstart", "drag(event)");
    set.src = original.src;
    ev.target.appendChild(set);
 }

function trash(ev) {
    ev.preventDefault();
    var data=ev.dataTransfer.getData("Text");
    var set=document.getElementById(data);
    set.setAttribute("id", "empty");
    set.setAttribute("class", "empty");
    set.firstElementChild.setAttribute("value", "empty");
    set.removeAttribute("draggable");
    set.removeAttribute("ondragstart");
}
4

1 回答 1

1

似乎我使用的方法完全错误，所以我使用了一种新方法。我实际上没有设置属性，而是使用 'cloneNode(true)' 克隆了基本 'div'，然后获取克隆的元素父级并设置输入值。

function clone(ev) {
    ev.preventDefault();
    var data = ev.dataTransfer.getData("Text");
    var original = document.getElementById(data);
    var clone = original.cloneNode(true);
    var copyimg = original.parentNode.appendChild(clone);
    copyimg.setAttribute("id", data+'-'+counter++);
    ev.target.appendChild(copyimg);
    var set = copyimg.parentNode;
    set.firstElementChild.setAttribute("value", data.split('-')[0]);
 }
于 2013-05-15T15:07:37.603 回答