1

我有一个 img,我只想放入名为 的 div 中#div1。当我拖过 div 时,我想获取容器的 id,但这会发出很多警报,而不仅仅是一个....

 <img id="drag1" 
      src="http://www.vectortemplates.com/raster/batman-logo-big.gif" 
      draggable="true" 
      ondragstart="drag(event, this)" 
      width="336" 
      height="69"/>

  <div id="div1"
       ondrop="drop(event)"  
       ondragenter="allowDrop(event, this)">
  </div>

JS:

function allowDrop(ev, obj)
{
    alert(obj.id);
}

那么为什么我要接收很多警报???

见那里的演示:http: //jsfiddle.net/PbjJv/

4

2 回答 2

1

解释

ondragover光标在. _ _ div尝试使用释放鼠标按钮ondragleave时触发的事件。


解决方案

在您的 div 上使用该ondragleave事件:

HTML

 <div id="div1"  ondragleave="allowDrop(event, this)"></div>

JSFiddle

于 2013-06-12T15:04:00.750 回答
0

这个接受的答案是不正确的。

来自 MDN:

当元素或文本选择放在有效的放置目标上时,会触发 drop 事件。

和:

当拖动的元素或文本选择离开有效的放置目标时,会触发 dragleave 事件。

在事件触发时调用 allowDrop()ondragleave将允许在拖动离开该元素后拖放到 DIV。ondrop当用户松开鼠标按钮时,有问题的元素不会收到最终事件。

这个问题似乎已经过编辑,在这一点上对我来说似乎很好。OPs 问题中引用的 jsfiddle 暗示了这一点,因为它使用而ondragover不是div1ondragenter

于 2013-07-12T15:35:58.517 回答