Image 如何使用HTML5拖放在线图像？

我目前正在测试拖放。从我的桌面拖放一个图像效果很好，但我遇到了一个问题：当我从另一个网站，甚至是从同一个网页使用a拖放一个在线图像时，变量e.dataTransfer.files是空的

总而言之，我想做的是：你把一张图片从你的桌面拖到我的页面上的一个特殊区域，然后它会在一个页面中显示图片。我希望能够从我的页面上拖出一个图像，比如说，嘿，你可以先试试这些图像

---

对于拖放的基础知识，我从本教程中得到了灵感：

，因为在线拖放被解释为链接，而不是文件传输。您必须首先将图片保存在桌面上，然后它将被视为真正的拖放。 但是，由于您的页面上已经有了图片，您可以通过使用现有图像（例如使用javascript）填充画布来实现目标

---

附言：只有当你使用两种不同的浏览器时，拖放才能按你想要的方式工作，例如，将图片从IE拖到FF中。为此，您需要在两种不同的浏览器中加载页面。

谢谢您的回答，我能更好地理解！但是我如何从丢弃的图像中获取任何信息，即使我在页面上有它，并且我知道该图像的路径，我想知道，好的，是image1/image2/image3被丢弃了。正如我所说，e.dataTransfer.files是空的。如果你的页面上已经有你的图像，你可以向你的图像添加一个事件监听器，例如onclick，或者onmousedown，这是当用户按下鼠标按钮但还没有释放它时的事件。然后，您将知道单击了哪个图像，并且能够从DOM结构中提取信息，如id、src。您可以找到添加到HTML5的新事件