JavaScript变量在onload函数内部未更改

时间:2019-08-24 14:22:08

标签: javascript filereader

此代码始终使我在警报中返回“ 3”。

我同时选择了两个文件(一个.mp4格式和第二个.zip格式)

    function readFile(input) {
        var counter = input.files.length;
        for(x = 0; x<counter; x++){
            if (input.files && input.files[x]) {
                var extension = input.files[x].name.split('.').pop().toLowerCase();
                var reader = new FileReader();

                reader.onload = function (e) {
                    urlss = 1;
                    if(extension == 'mp4'){
                        urlss = 2;
                    }else{
                        urlss = 3;
                    }
                    alert(urlss);
                };
                reader.readAsDataURL(input.files[x]);
            }
        }
    }
<input type="file" id="files" name="files[]" accept=".png, .jpg, .jpeg, .zip, .mp4" onchange="readFile(this);" multiple />

1 个答案:

答案 0 :(得分:2)

那是因为var hoisting

在for结束且扩展名== onload

之后调用的last file extension函数

尝试用const替换var:

function readFile(input) {
    var counter = input.files.length;
    for(let x = 0; x < counter; x++){
        if (input.files && input.files[x]) {
            const extension = input.files[x].name.split('.').pop().toLowerCase();
            const reader = new FileReader();

            reader.onload = function (e) {
                urlss = 1;
                if(extension == 'mp4'){
                    urlss = 2;
                }else{
                    urlss = 3;
                }
                alert(urlss);
            };
            reader.readAsDataURL(input.files[x]);
        }
    }
}

更新

请在下面查看韦伯的评论。