我在FileReader.onload()
事件中遇到了一些问题:
以下两个代码段之间获得不同结果的原因是什么?一旦传递object
实例,而不是显式的this.attachmentIndex
值,我就会得到不同的结果。
1)
fileReader.onload = (function (file, obj) {
return function (evt) {
obj.attachmentIndex // 1
};
})(f, this);
2)
fileReader.onload = (function (file, index) {
return function (evt) {
index // 0
};
})(f, this.attachmentIndex);
闭包-FileReader.onload()
我面临的另一个问题是,我似乎无法将多个参数传递给
FileReader.onload()
事件处理程序。 fileReader.onload = (function (file, one, two) {
return function (evt) {
one // 1
two // undefined
};
})(f, 1, 2);
在下面可以找到整个对象。我必须做一些难看的事情才能实现我想要的。我真的希望有更好的方法来达到相同的结果。
function Note() {
this.attachmentOutput = [];
this.attachmentIndex = 0;
this.debugging = false;
this.currentWorkingObject = new NoteObject(helperFn.createGuid());
this.addAttachement = function(files) {
for (var i = 0, f; f = files[i]; i++) {
var fileReader = new FileReader(),
fileReader.onload = (function (file, obj) {
return function (evt) {
var base64File = evt.target.result;
obj["note"].addDataToAttachementObj(obj["index"], { data: base64File })
};
})(f, { note: this, index: this.attachmentIndex});
// Async => reading file
fileReader.readAsDataURL(f);
this.attachmentIndex++
}
var html = app.outputTemplate(this.currentWorkingObject.attachements);
$('.upload-output').html(html);
};
};
触发功能:
$(".upload-drop-zone").on('drop', function (e) {
e.preventDefault();
var files = e.originalEvent.dataTransfer.files;
app.myCurrentNote.addAttachement(files);
});
最佳答案
我想要0作为闭包中索引值的结果-最后我
做到了,但是有了这个丑陋的解决方法。如果我不通过
参数,那么我得到1而我不知道为什么。FileReader
是异步的。 this.attachmentIndex
似乎在以下位置增加到1
// Async => reading file
fileReader.readAsDataURL(f);
this.attachmentIndex++ // <- `this.attachmentIndex` incremented to `1` here
可能在
FileReader.onload
事件被调用之前。关于javascript - FileReader()-闭包和传递参数的问题,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/30547856/