Question

好的，所以我读了很多文章并尝试了很多方法。他们都没有工作。我正在尝试将文件阅读器构建到我的代码中，我只是一次又一次地在错误后得到错误。注意：这是代码的简化版本。我也试过了大约10种不同的方法，既没有成功，也有问题。

function init(){
    // start the constructor
    constructTable = new constructTableS("ConstructionTable");
};

function constructTableS(name){
    // Variables 
    this.name = name;
    this.csv = "";
}

constructTableS.prototype.load = function(files){
    if (window.FileReader) {
        // FileReader is supported.
        var reader = new FileReader();

        reader.onload = function(e){
            //Tried this as well : var csv = event.target.result}; 
            this.csv = reader.result};

        var x = reader.readAsText(files);



    } else {
        alert('FileReader are not supported in this browser.');
    };

目的是通过身体初始化开始功能。

<body onload="init()">

然后调用＆＃34;类＆＃34;的加载函数。并从文件中发送数据？

<input type="file" id="csvFileInput" onchange="constructTable.load(this.files)" accept=".csv">

我得到的错误是：参数1不属于＆＃39; Blob＆＃39;。这来自此行 var x = reader.readAsText（files）;

我试图做的是将数据加载到变量而不是innerHTML插槽中。我已经阅读了很多这样的例子。 parameter is not of type 'Blob'

一旦调用该事件，它就不会识别我的类并忽略该类中的任何函数，因此我无法存储数据。或者它只是返回，而不是类型blob。

我从这里举了个例子： http://mounirmesselmeni.github.io/2012/11/20/reading-csv-file-with-javascript-and-html5-file-api/

这样可行，但它没有将代码读入类中的变量，我可以在需要时调用它。

Answer 1

<input type="file" id="csvFileInput" onchange="constructTable.load(this.files)" accept=".csv"> this.files返回上传文件数组，一次读取一个文件，使用循环

for (var i = 0; i < files.length; i++) {
    //your logic goes here
}

this引用当前HTMLElement作为文件输入元素，此元素具有名为files的属性，该属性是已选择的文件数组。

或者，如果您一次只允许用户上传一个文件，请将this.files更改为this.files[0]

存储到内存中的Javascript FileReader - 参数1不是类型＆＃39; Blob＆＃39;

1 个答案: