Javascript：用拖放替换图像答案

【问题标题】：Javascript : replace image with drag dropJavascript：用拖放替换图像
【发布时间】：2016-06-09 11:42:04
【问题描述】：

我正在尝试通过拖放（文件资源管理器中的另一个图像）替换图像，但我不知道如何。有什么想法吗？

HTML

 <div id="drop-zone">
     <div class="insidzoneDropped">
         <img src="/images/folderdropped-icon.png" />
     </div>
 </div>

 function handleDragEnter(e) {
     e.stopPropagation();
     e.preventDefault();
     //e.dataTransfer.setData("Id",    e.target.id+"|"+e.target.parentNode.id);
 }
 function handleDrop(e) {
     e.stopPropagation();
     e.preventDefault();
 }
 var dropZone = document.getElementById('drop-zone');
 dropZone.addEventListener('dragenter', handleDragEnter, false);
 dropZone.addEventListener('drop', handleDrop, false);

【问题讨论】：

您的代码看起来不完整（handleDragEnter 未关闭）。此外，您应该更详细地描述，您想要什么行为，您的代码会发生什么以及您想要更改什么。
@YakovL 我想替换图片但我不知道如何
显然您想在某些用户操作上替换图像。究竟是什么动作？
@YakovL 我想把我的新图标放在我的应答器里<img>
在放之前你想从哪里拖动它？

标签： javascript drag-and-drop

【解决方案1】：

尝试阅读前两篇文章here。它们很详细，因此您必须了解此特定任务所需的更多信息，或者过滤不必要的信息并尝试运行并实施您需要的内容。第一个是关于使用拖放本身，第二个将告诉您如何处理拖放的文件内容（也有一个几乎您需要的示例）。

一个重要提示：如果您想拖放并让图像获得本地文件的实际路径，请知道由于安全限制，这是不可能的。您可以获得的是文件的 contents（图像将采用 base64 编码，除非您将其保存到服务器）。

【讨论】：