在 Firefox 或 IE 中未触发拖动事件答案

【问题标题】：The drag event not firing in Firefox or IE在 Firefox 或 IE 中未触发拖动事件
【发布时间】：2015-03-03 13:11:02
【问题描述】：

在 Chrome 中，拖动事件被触发并记录到控制台。在 Firefox 和 IE 中，它不会。

<html>
<head>

<style>
  #d {
    width:20px;
    height:20px;
    background-color: red;
  }
</style>

</head>
<body>

<div id="d" draggable="true"></div>

<script>
    d = document.getElementById('d');
    d.addEventListener('dragstart', function(e){
      console.log("dragstart:", e);
    });
    d.addEventListener('drag', function(e){
      console.log("drag:", e);
    });
</script>

</body>
</html>

小提琴版本：http://jsfiddle.net/korimako/e1wqafyr

如何设置一个 div 来调度拖动事件并正确监听它们？

【问题讨论】：

标签： javascript html draggable

【解决方案1】：

Firefox 要求在触发拖动事件之前设置 dataTransfer

d = document.getElementById('d');

d.addEventListener('drag', function(e){
    console.log("drag:", e)
});

d.addEventListener('dragstart', function(e){
    e.dataTransfer.setData('application/node type', this);
    console.log("dragstart:", e)
});

FIDDLE

有关拖动类型，请参阅 this

【讨论】：

当可拖动元素在锚元素内时，这不起作用。