读取拖放的文件 [英] Read a Drag and Dropped file

问题描述

我尝试使用dataTransfer.files上传文件，但是读取单个文件应使用的方法或属性是什么?

I tried uploading files with the dataTransfer.files but what is the method or property that should be used for reading a single file?

推荐答案

FileReader.readAsArrayBuffer()
开始读取指定Blob的内容，完成后，result属性包含一个表示文件数据的ArrayBuffer.
FileReader.readAsBinaryString()
开始读取指定Blob的内容，完成后，result属性包含来自文件的原始二进制数据作为字符串.
FileReader.readAsDataURL()
开始读取指定Blob的内容，完成后，result属性包含一个数据:表示文件数据的URL.
FileReader.readAsText()
开始读取指定Blob的内容，完成后，result属性包含文件内容作为文本字符串.
以下演示可以对您有所帮助
演示

FileReader.readAsArrayBuffer()
Starts reading the contents of the specified Blob, once finished, the result attribute contains an ArrayBuffer representing the file's data.
FileReader.readAsBinaryString()
Starts reading the contents of the specified Blob, once finished, the result attribute contains the raw binary data from the file as a string.
FileReader.readAsDataURL()
Starts reading the contents of the specified Blob, once finished, the result attribute contains a data: URL representing the file's data.
FileReader.readAsText()
Starts reading the contents of the specified Blob, once finished, the result attribute contains the contents of the file as a text string.
following demo can be helpful for you
Demo

var file = e.dataTransfer.files[0],
      reader = new FileReader();
  reader.onload = function (event) {
    console.log(event.target.result);
    //holder.style.background = 'url(' + event.target.result + ') no-repeat center';

  };
  console.log(file);
  reader.readAsDataURL(file);

这篇关于读取拖放的文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！