我在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/

10-13 04:10