Sonuç ve parametre

Question

parametresine sahip FileReader onload Yükleyicinin hem sonucun sonucunu hem de bir yükleme fonksiyonundaki bazı parametreleri almayı başaramıyorum. Ben onload işlevinde, filereader.result kullanmak

files_input.addEventListener("change", openFiles, false); 

:

function openFiles(evt){ 
    var files = evt.target.files; 
    for (var i = 0; i < files.length; i++) { 
     var file=files[i]; 
     reader = new FileReader(); 
     reader.onload = function(){ 
      var data = $.csv.toArrays(this.result,{separator:'\t'}); 
     }; 
     reader.readAsText(file); 
    } 
    } 

Etkinlik ekle: kontrolden

HTML:

<input type="file" id="files_input" multiple/> 

JavaScript işlevi Bu benim kodudur. Bu işlev için dosya gibi bir parametre kullanırsam, artık sonuca erişemiyorum. Örneğin, onload fonksiyonunda file.name kullanmak istiyorum. Bu sorun nasıl çözülür?

Answer 1

Yükleme işlevinizi başka bir işlevde sarmayı deneyin.

• JavaScript closure inside loops – simple practical example
• : Bir kapatma burada neden gerekli olduğu hakkında bir tartışma için

  function openFiles(evt){ 
      var files = evt.target.files; 
  
      for (var i = 0, len = files.length; i < len; i++) { 
       var file = files[i]; 
  
       var reader = new FileReader(); 
  
       reader.onload = (function(f) { 
        return function(e) { 
         // Here you can use `e.target.result` or `this.result` 
         // and `f.name`. 
        }; 
       })(file); 
  
       reader.readAsText(file); 
      } 
  } 
  

  bu ilgili soruları bakın: Burada kapatma değişkene f aracılığıyla sırayla işlenen her dosya erişim sağlar Javascript infamous Loop issue?

Answer 2

'Yükü kaldırma' işleyicisinde kapatmayı kullanmalısınız. Örnek: Değişken dosya kapsamında olduğu için http://jsfiddle.net/2bjt7Lon/

reader.onload = (function (file) { // here we save variable 'file' in closure 
    return function (e) { // return handler function for 'onload' event 
     var data = this.result; // do some thing with data 
    } 
})(file); 

Answer 3

, bunu işlev geçmeden dosya değişken kullanabilir.

function openFiles(evt){ 
 
    var files = evt.target.files; 
 
    for (var i = 0; i < files.length; i++) { 
 
      var file=files[i];  
 
      reader = new FileReader(); 
 
      reader.onload = function(){ 
 
       alert(file.name); 
 
       alert(this.result); 
 
      }; 
 
     reader.readAsText(file); 
 
    } 
 
    } 
 

 
files_input.addEventListener("change", openFiles, false);

<input type="file" id="files_input" multiple/>

Answer 4

Olay işleme eşzamansız ve böylece hepsi kapalı lokal değişkenler (yani. Kapanması) en son değeri al. Etkinliğe belirli yerel değişkeni bağlamak için, ya da bu çalışma örnek bakabilirsiniz yukarıda kullanıcılar tarafından önerilen kodunu takip etmek gerekir: -

http://jsfiddle.net/sahilbatla/hjk3u2ee/

function openFiles(evt){ 
    var files = evt.target.files; 
    for (var i = 0; i < files.length; i++) { 
    var file=files[i]; 
    reader = new FileReader(); 
    reader.onload = (function(file){ 
     return function() { 
     console.log(file) 
     } 
    })(file); 
    reader.readAsText(file); 
    } 
} 

#Using jQuery document ready 
$(function() { 
    files_input.addEventListener("change", openFiles, false); 
});