如何显示FileReader加载进度或加载图标?

时间:2017-06-02 14:55:01

标签: javascript dojo

我有一个文件上传控件,它读取TXT文件并加载带有文件内容的editBox。代码打击适用于文件上传控制的onChange事件。但它我想在加载大数据时显示加载gif图标或沙漏图标。例如。如果我尝试加载大约130K行的3Mb文件,则需要几秒钟才能在inputUsers编辑框中显示然后仍然加载数据。虽然这次用户可以单击其他控件或关闭页面。那么当我调用reader.readAsText(file)时,如何显示加载图标; ???

var fileUploadControl = dojo.query("[id$=':fileUploadControl']")[0];
var file = fileUploadControl.files[0];

var reader = new FileReader();
reader.onload = function(e) {
    dojo.query("[id$=':inputUsers']")[0].value = reader.result;
}
reader.readAsText(file);

注意:当您将非常大的文本复制/粘贴到多行editBox中时,也会发生同样的情况。我需要在列表加载时显示一些东西

1 个答案:

答案 0 :(得分:0)

试试这段代码

reader.onloadstart = function(event) {
    ShowLoadingBar();
};
reader.onprogress = function(event) {
    if (event.lengthComputable) {
        if (LoadingBarVisible)
            ShowLoadingBar();
        AddProgress();
    }
};
reader.onloadend = function(event) {
    LoadingBarComplete();
};