Question

您好我试图使用HTML5拖放制作一个javascript网络应用。它是关于孩子们的游戏，他们需要将一个数字（从1到6，它们都是容器中的div中的图像）拖到背景具有一定数量项目的div。因此，如果div具有6个糖果的背景图像，则需要将数字6拖到其上。

我做得很好，我得到了我的代码来处理拖放工作，但我想要这样做：

- 当一个孩子将一个数字拖到一个div上，然后意识到他错了，他可以拖动正确的数字，之前的数字就会消失。但是使用我当前的代码，如果您尝试新的拖动数字消失，并且div保留旧数字。

这是我的代码：

// JavaScript Document
window.Mover = window.Mover || {};
window.Mover = ( function ( ) {
    "use strict" ;  

    function Mover ( ) {
    }

    Mover.prototype.allowDrop= function (e)
    {
        e.preventDefault();
    };

    Mover.prototype.drag = function (e) 
    {

        e.dataTransfer.setData("Text",e.target.id);

    };



    Mover.prototype.drop = function (e) 
    {

            e.preventDefault();
            var data=e.dataTransfer.getData("Text");        
            e.target.appendChild(document.getElementById(data));


    };  

    return Mover ;
                             }( ) ) ;



    var moviendo = new Mover( ) ;

任何帮助都会受到赞赏，ty！

Answer 1

appendChild()不删除旧元素;新的可能就在那里，但你看不到它。在添加新元素之前尝试这样的事情：

e.target.removeChild(e.target.childNodes[0])

如何在html5拖放被占用的div期间用另一个替换图像

1 个答案: