javascriptfiledrag-and-dropdata-transfer-objects

how to get the files from drag and drop, similar as input.Files


When you select a file by clicking <input type="file" id="file">, you can use the file in any moment you want by just: let file=document.querySelector("#file").files[0];but when using drag/drop as far as I know, you can only use the file inside the drop function handler

 targDrop.addEventListener("drop",function(e){let file=e.dataTransfer.files[0]});

So, is there any way to get the file similar as input.Files[0] even after the drop handler function returns and without uploading file to memory?


Solution

  • Actually the answer was very straightforward, I just saved the file in a variable and that's it. I don't know what I was thinking by that time :D

    let file="";
    targDrop.addEventListener("drop",function(e){file=e.dataTransfer.files[0]});