【问题标题】:Waiting for a file to load (onload JavaScript)等待文件加载(加载 JavaScript)
【发布时间】:2023-03-21 17:11:01
【问题描述】:

我想从文件中读取文本并在函数中返回。所以这是我的代码的重要部分:

        function getFileRequest(id, contentType, callback) {
        var val = "x";      

        if (window.File && window.FileReader && window.FileList && window.Blob) {
            var element = document.getElementById(id);

            var file = element.files[0]; 
            if(file != null) {      
                if(file.type.match("text/xml")){
                    var r;
                    r = new FileReader();

                    r.onload = function (e) {
                        val = e.target.result;                    

                    }                   
                    r.readAsText(file);
                }
                else
                    alert("Wrong file format");
            }

        } else {
            alert('The File APIs are not fully supported by your browser.');
        }

        alert(val);
        if(val == null)
                return "";
            else
                return getRequestBody(id,contentType,val);  

    }

我想将文本传递给一个名为“val”的变量。但是,至少在我看来,alert(val) 总是显示默认的“x”,因为它可能没有等待执行 onload 函数。我完全正确吗? 那么我怎样才能访问该文本呢?有没有办法等待执行?

【问题讨论】:

  • 您不能将异步操作视为同步操作。

标签: javascript file onload wait filereader


【解决方案1】:

当然,alert 不在 onload 函数中,所以它会立即被调用。

你可以这样做:

        var val = "x";      
        //... code to load a file variable
        var r;
        r = new FileReader();

        r.onload = function (e) {
            val = e.target.result;  
            r.readAsText(file);
            alert(val);
        };  

你不能等待和停止你的代码的执行,所以一般的想法是使用回调来推迟它。

假设你展示的代码真的要分两部分完成,一个做文件操作,另一个使用它,它可能是这样的:

function fetchVal(callback) {
        var val = "x";      
        //... code to load a file variable
        var r;
        r = new FileReader();
        r.onload = function (e) {
            val = e.target.result;  
            r.readAsText(file);
            callback(val);
        };  
}

fetchVal(function(val){
   alert(val);
   // use val
});

【讨论】:

  • 嗯,当然,但我想要的是在该 onload 函数之外获取此文本
  • 你的 onload 函数可以调用另一个函数,但你不能只是停止执行。
  • 那么您知道我如何才能真正获取文件文本并将其返回到我的版本中现在有 alert(val) 的函数中吗?
  • 我不确定我是否完全理解回调,但我用更大的代码编辑了我的帖子,所以你可以看到我想如何使用这个 val 变量。老实说,我不知道如何使用回调和您给出的示例。即使我可以以某种方式在你用评论破坏的部分中使用它,我仍然需要在以前的函数中获取这个值。
  • 要写javascript,确实需要了解异步调用和回调的逻辑。没有其他方法可以处理异步操作,例如文件读取。
猜你喜欢
  • 2019-01-08
  • 1970-01-01
  • 2010-11-30
  • 2014-04-11
  • 2012-02-04
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多