Question

我有一个被丢弃的图像，但是在删除Element之后它在此处不可见。消息显示但实际丢弃时图像不可见。
丢弃的元素在丢弃时不可见。我知道问题可能与appendchild有关，但我无法弄清楚它为什么不存在工作

这是我的代码： CSS

.droptarget {
        float: left;
        width: 100px;
        height: 35px;
        margin: 15px;
        padding: 10px;
        border: 1px solid #aaaaaa;
    }
    .auto-style1 {
        float: left;
        width: 100px;
        height: 35px;
        margin: 15px;
        padding: 10px;
        border: 1px solid #aaaaaa;
        text-align: right;
    }

的Javascript

  function startDrag(event) {
        event.dataTransfer.setData("Text", event.target.id);
        document.getElementById('demo').innerHTML = 'You started to Drag!!';
    }

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

    function drop(event) {
        event.preventDefault();
        var dropElement = event.dataTransfer.getData("Text");
        event.target.appendChild(document.getElementById('dropElement'));
        document.getElementById('demo').innerHTML = 'Element Dropped!!';
    }

HTML

  <div class="auto-style1">
                <img id="Drag1" src="../Downloads/Nobi.jpg" style="width:34px" height="45px" draggable="true" ondragstart="startDrag(event)" ondragover="allowDrop(event)" />

            </div>
            <div class="droptarget" draggable="true" ondrop="drop(event)" ondragover="allowDrop(event)">

            </div>
            <p id="demo"> </p>

Answer 1

试试这个

以下是Demo

以下是反向案例Demo

反向案例HTML

FALSE

尝试使用此代码

HTML

<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)">
        <img ondragstart="drag(event)" draggable="true" title="drag here" id="myImage" src="http://www.rw-designer.com/res/oism.png" />

</div>
<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>

的Javascript

<h1>Drag and Drop</h1>
<span draggable="true" id="div1"  ondragstart="drag(event)">
        <img title="drag here" id="myImage" src="http://www.rw-designer.com/res/oism.png" />
</span>

<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>

掉落的元素不可见

1 个答案: