Javascript FileReader in einem Speicher zu Speicher - Parameter 1 ist nicht vom Typ 'Blob'

Question

ok, also habe ich eine Reihe von Artikeln gelesen und versuchte eine Reihe von Ansätzen. Keine von beiden funktioniert. Ich versuche, den File Reader in meinen Code zu integrieren und erhalte immer wieder einen Fehler nach dem anderen. Hinweis: Dies ist eine reduzierte Version des Codes. Ich habe auch über 10 verschiedene Wege ausprobiert, weder erfolgreich, daher die Frage.

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.'); 
    }; 

Ziel ist es, die Funktion mit der Körperinitialisierung zu beginnen.

Dann rufen Sie die Ladefunktion der "Klasse" und senden Sie die Daten aus der Datei?

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

Der Fehler, ich erhalte, ist: Parameter 1 ist nicht vom Typ 'Blob'. Dies kommt von dieser Zeile var x = reader.readAsText (Dateien);

was ich versuche, ist das Laden der Daten in eine Variable nicht ein innerHTML-Steckplatz. Ich habe zahlreiche Beispiele wie diese gelesen. parameter is not of type 'Blob'

Sobald das Ereignis aufgerufen wird, wird es entweder meine Klasse nicht erkennen und keine Funktionen in der Klasse ignorieren, daher kann ich die Daten nicht speichern. Oder es kommt einfach zurück, nicht vom Typ Blob.

Ich habe das Beispiel von hier genommen: http://mounirmesselmeni.github.io/2012/11/20/reading-csv-file-with-javascript-and-html5-file-api/

Das funktioniert aber es den Code in eine Variable nicht in einer Klasse lesen, die ich anrufen kann, wenn ich es brauche.

Answer 1

<input type="file" id="csvFileInput" onchange="constructTable.load(this.files)" accept=".csv"> Die this.files gibt ein Array von hochgeladenen Dateien, eine Datei zu einem Zeitpunkt zu lesen, verwenden, um eine Schleife

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

Die this bezieht sich auf die aktuellen HTMLElement die die Elementdatei eingegeben wird, und dieses Element hat eine Eigenschaft namens files, die ein Array von Dateien ist, die ausgewählt wurden.

Oder wenn Sie nur können Benutzer eine Datei auf einmal hochladen, ändern this.files zu this.files[0]