拖放工作在Chrome中，而不是Firefox

Question

这是一个拖放图像的示例（由安迪·奥尔森（Andy Olsen）提供的“ HTML5 Power Workshop”课程提供）： http : //aorbaroquethrash.com/dragdrop/

您必须将图像从桌面拖到黄色正方形。

它可以在Chrome中运行，但不能在Firefox中运行，为什么？

有类似的帖子： 拖放在firefox中不起作用它说使用“​​ dataTransfer.setData”，但我认为它不适用于我的示例。

在我的示例中，我使用var allTheFiles = event.dataTransfer.files; ...

帕特里克

Answer 1

该站点存在错误。 该代码显示为：

// Handles drop events.
function onDrop(mouseEvent) {
...
    // Get the first file dragged by the user.
    var allTheFiles = event.dataTransfer.files;
    var firstFile = allTheFiles[0];
…
}

event.dataTransfer.files应该是mouseEvent.dataTransfer.files 。

它在Chrome中运行的原因显然是Chrome实现了非标准的IE样式window.event ，而Firefox却没有。

这是一个经过纠正的小提琴 ，可在Firefox，Chrome，Safari和IE10中使用（测试）。