在保持拖动元素的副本的同时拖放

时间:2014-06-27 09:23:23

标签: javascript html html5 drag-and-drop

我想将输入元素从一个div拖放到另一个div,同时保持父div.i中拖动元素的副本实现此目的。但是在删除之后  进入droppable div仍然执行拖放功能  允许多个副本也。但我不想要这个..怎么样  可以避免放弃div。

           function allowDrop(ev)
                    {
                        ev.preventDefault();
                    }  //alert("droped");  //alert("droped");

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

                    function drop(ev)
                    {             
                        var data=ev.dataTransfer.getData("Text");
        ev.target.appendChild(document.getElementById(data).cloneNode(true));
                        ev.preventDefault();
    }

html page:

    <div id="drag1"  draggable="true" ondragstart="drag(event)" >
<div id="drag1"  draggable="true" ondragstart="drag(event)" >

            <div class="drag"  onclick='return false;'readonly>
            <label>
                textbox</label><input  type="text" name="text" value="">
            </div>
        </div><br>

        <div id="drag2" class="drag" draggable="true" ondragstart="drag(event)" >
            <div onclick='return false;'>
                <input type="radio" name="" value=""><label>check button</label><br>
            </div> <br>
        </div>

        <div id="drag3" class="drag" draggable="true" ondragstart="drag(event)" >
            <div>
                <input type="checkbox" name="" value=""><label>check box</label><br>
            </div> 
        </div><br>

    

0 个答案:

没有答案