在拖放过程中从外部远程图像读取URL数据

Reading URL data from an external remote image during drag and drop

本文关键字：图像 读取 URL 数据 过程中 拖放 从外部 程图像      更新时间：2023-09-26

这将接受拖放的本地文件，并将文件数据读入files字符串。如何读取直接从浏览器掉落的远程图像?即从谷歌图像搜索拖拽图像到Dropzone并读取图像URL。

<!DOCTYPE html>
<html>
  <body>
    <div id="dropzone"></div>
    <script>
      function handleFileSelect(evt){
        evt.stopPropagation();
        evt.preventDefault();
        var files = evt.dataTransfer.files;
      }
      // Setup the dnd listener
      var dropZone = document.getElementById('dropzone');
      dropZone.addEventListener('drop', handleFileSelect, false);
    </script>   
  </body>
</html>

据我所知，您显示的文件不在本地系统上，而是远程显示在浏览器中。如果你显示图像或图像图标而不是文件，将元素设置为可拖拽的，并允许在其他元素上拖放。然后编写代码来复制或在服务器端做一些事情。

相关文章：