如何读取文件？

Question

您好，我正在尝试使用jquery读取文件：

下面是我的代码：

var fileInput = $('#datafile');
readFile = function () {var reader = new FileReader();
reader.onload = function () {
console.log(reader.result);
};
// start reading the file. When it is done, calls the onload event defined above.
reader.readAsBinaryString(fileInput.files[0]);
};

fileInput.on('change', readFile);

但我在控制台上什么都没有...

你能帮我个忙吗？

Answer 1

但是我在控制台里什么都没有...

当我运行该代码(并更改输入的值)时，我得到：

未捕获TypeError:无法读取未定义的属性“0”

fileInput是一个jQuery对象。它不是文件输入对象。它没有files属性(所以files是undefined，它不能有0属性)。

您需要处理输入对象：

fileInput[0].files[0]

Answer 2

本地文件读取和控制台数据

​

$('#fileInput').on('change', function () {
    var fileReader = new FileReader();
    fileReader.onload = function () {
      var data = fileReader.result;  //file data in Base64 format
      console.log(data);
    };
    fileReader.readAsDataURL($('#fileInput').prop('files')[0]);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<div id="div">

</div>

<input id="fileInput" type="file" />

​