Javascript 画布中的dragover事件不'；不要在firefox上开火

我正在尝试做的是一个面板来添加你的图像，它可以旋转、缩放、移动和裁剪。用户应该能够通过拖动来移动图像

该应用程序在Chrome、IE、Opera和Safari中运行良好，但由于某些原因，拖动在Firefox上不起作用。调试代码我看到事件

dragover

没有被触发，但是控制台没有显示任何错误，所以我真的不知道出了什么问题

根据，您需要将数据设置到

DragStart

事件的

dataTransfer

属性中

在您的例子中，

CanvasMouseDown（e）

函数是

#picture

的

DragStart

的事件处理程序，因此您应该在该函数的某个地方调用：

e.dataTransfer.setData( datatype, datacontent );

下面，我更新了您的示例，将其设置为

text/plain

，这足以“让它工作”，因为您正在拖动而不是拖放。在后一种情况下，设置

image/xxx

更有意义，其中

xxx

是合适的格式（例如

png

或

jpeg

）

（通过Firefox 25.0.1，Win 7 SP 1验证。）

根据，您需要

将数据设置到
DragStart
事件的
数据传输属性中

在您的例子中，
CanvasMouseDown（e）
函数是
#picture
的
DragStart
的事件处理程序，因此您应该在该函数的某个地方调用：

e.dataTransfer.setData( datatype, datacontent );

下面，我更新了您的示例，将其设置为
text/plain
，这足以“让它工作”，因为您正在拖动而不是拖放。在后一种情况下，设置
image/xxx
更有意义，其中
xxx
是合适的格式（例如
png
或
jpeg
）

（已通过Firefox 25.0.1，Win 7 SP 1验证。）
我是否可以将图像放到大的
div
/
画布上？因为在Firefox 25和Chrome 31中，如果你将一个图像放在那里，我会看到窗口位置发生变化。你可以将一个图像添加到画布并尝试移动它，这将在safari、Chrome上起作用，但在Firefox中不起作用。这是一个很好的拖动事件示例。不过有一条评论，我认为自从版本16（差不多一年前）以来，
style.transform
在Mozilla（不再是
style.MozTransform
）中就没有前缀了。我应该能够将图像放到大的
div
/
画布上吗？因为在Firefox 25和Chrome 31中，如果你将一个图像放在那里，我会看到窗口位置发生变化。你可以将一个图像添加到画布并尝试移动它，这将在safari、Chrome上起作用，但在Firefox中不起作用。这是一个很好的拖动事件示例。不过有一条评论，我认为自从版本16（差不多一年前）以来，
style.transform
已经在Mozilla中取消了前缀（不再是
style.MozTransform
）。