将图像拖放到篮子中

时间:2014-08-21 05:46:18

标签: javascript html

我可以将彩色框拖放到篮子里但是我无法将图像拖放到篮子里。

这是一个脚本

<script type = "text/javascript" > function dragStart(ev) {
    ev.dataTransfer.effectAllowed = 'move';
    ev.dataTransfer.setData("Text", ev.target.getAttribute('id'));
    ev.dataTransfer.setDragImage(ev.target, 0, 0);
    return true;
}

function dragEnter(ev) {
    event.preventDefault();
    return true;
}

function dragOver(ev) {
    return false;
}

function dragDrop(ev) {
    var src = ev.dataTransfer.getData("Text");
    ev.target.appendChild(document.getElementById(src));
    ev.stopPropagation();
    return false;
} </script>

这是 Fiddle

1 个答案:

答案 0 :(得分:1)

这里我已经将图像设置为Div背景。

同样,

<div id="image1" draggable="true" ondragstart="return dragStart(event)" style="height: 50px;width: 50px;  background: url('http://www.chicmags.com/wp-content/uploads/2014/04/10-Fruits-for-Hair-Growth-50x50.png');" >

这是 DEMO