Question

所以，我使用FileReader来阅读用户选择的文件，而在Chrome中，一切都运行顺畅。但是，在Mozilla中，onloadstart事件未被触发。 The official page表示这样的事件监听器确实存在。我错过了什么吗？

这是我的代码：

function handleUploadFile() {
    if(window.FileReader) {
        const fileChooser = document.createElement('input');
        fileChooser.setAttribute('type', 'file');
        document.body.appendChild(fileChooser);

        fileChooser.addEventListener('change', e => {
            const selectedFile = e.target.files[0];
            if(selectedFile) {
                const filename = selectedFile.name.split('.');
                const extension = filename[filename.length - 1];

                if (_.indexOf(['csv', 'dat'], extension.toLowerCase()) < 0) {
                    alert('The file must be of type ".csv" or ".dat"');
                    return;
                }

                const f = new FileReader();
                f.readAsText(selectedFile);

                f.onloadstart = (ev) => {
                    console.log('start');
                };

                f.onloadend = (ev) => {
                    console.log('end');
                    const content = ev.target.result;

                    this.parseFile(content, selectedFile.name, extension);
                };

                f.onerror = (ev) => {
                    console.error(ev.target.error);
                };
            } else {
                console.error('Failed to load file');
            }
        });
        fileChooser.click();
        document.body.removeChild(fileChooser);
    } else {
        alert('The File APIs are not fully supported by your browser.');
    }
}

Answer 1

在您收听之前会触发onloadstart事件。所以你需要改变这样的顺序：

const f = new FileReader();

f.onloadstart = (ev) => {
    console.log('start');
};

f.onloadend = (ev) => {
    console.log('end');
    const content = ev.target.result;

    this.parseFile(content, selectedFile.name, extension);
};

f.onerror = (ev) => {
    console.error(ev.target.error);
};

f.readAsText(selectedFile); //moved this line to the bottom

javascript - FileReader onloadstart未在Mozilla中触发

1 个答案: