javascript - 如何获取ondrop事件的目标id？

Question

我正在尝试获取拖动项目的目标/目的地的 ID。我有两个容器，因此我必须获取包含拖动元素的容器的 id。

这是我的代码:

    <div id="div1" ondrop="drop(event, this)" ondragover="allowDrop(event)"></div>
 <div id="div2" ondrop="drop(event, this)" ondragover="allowDrop(event)"></div>
    <br/>
    <img id="drag1" src="//placehold.it/336X69/ff0000" draggable="true" ondragstart="drag(event)" width="336" height="69" />

<小时/>

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

    function drag(ev) {
    ev.dataTransfer.setData('Text/html', ev.target.id);
    }

function drop(ev, target) {
    ev.preventDefault();
    console.log(target.id, ev.target.id)

    var data = ev.dataTransfer.getData("text/html");
    alert(data)
}

此代码的结果返回drag1而不是div1或div2。

我错过了什么？

Answer 1

drop() 中的

ev.target.id 是对目标项的引用。

试试这个代码:

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

function drop(ev, target) {
    ev.preventDefault();
    alert(ev.target.id)
}