在 JS 中不触发/触发的 Drop 事件答案

【问题标题】：Drop event not firing/triggering in JS在 JS 中不触发/触发的 Drop 事件
【发布时间】：2016-05-23 22:42:42
【问题描述】：

示例：https://jsfiddle.net/u3m4eazx/

我有 2 个可拖动的图像和 3 个可以放置图像的 div ($dropZones)。

$dropZones.forEach($z => {
  $z.addEventListener('dragover', onDragOver);
  $z.addEventListener('dragleave', onDragLeave);
  $z.addEventListener('drop', onDrop);
});

dragover 和 dragleave 事件触发并完美运行。我通过添加一个 css 类对 div 进行悬停效果。

const onDragOver = e => {
  e.preventDefault;
  let id = e.target.dataset.id;
  let dropzone = document.querySelector(`.dropzone[data-id="${id}"]`);
  dropzone.classList.add('ready');
};

在 dragleave 事件中，我只是删除了类。所以他们工作得很好。
但是 drop 事件不会触发。这就是我在 drop 事件中所拥有的

const onDrop = e => {
  console.log("Drop triggered");
  alert('Drop triggered');
};

有人知道为什么事件没有触发吗？

【问题讨论】：

@Downgoat 我不能和人打招呼吗？大声笑
See this post describing "Hello"s
简单的人类逻辑：如果您向愿意帮助您的人打招呼，这只是礼貌。无论如何感谢您的努力。
不用ES6还能用吗？如果不是，这不是 ES6 的问题（我不明白为什么会这样）。
不，没有 ES6 也无法工作。也许我应该删除 es6 标签，我想这会更有意义。

标签： javascript drag-and-drop event-handling

【解决方案1】：

是的，所以我回头看了看，发现preventDefault() 函数写错了。
我在没有() 的情况下写了它。
还是谢谢。

【讨论】：