JavaScript-在onload之外获取reader.result_Javascript_Io_Filereader

JavaScript-在onload之外获取reader.result

javascript io

JavaScript-在onload之外获取reader.result,javascript,io,filereader,Javascript,Io,Filereader,下面的代码是我目前拥有的。我想在onload之外提醒（reader.result），但它总是返回null。reader.result不应该在readAsText（）被调用并完成后保留其结果吗？更具体地说，我的最终目标是读取文件中的文本，然后将其保存在变量中以备将来使用。我只是将警报用作调试工具（我知道可能很糟糕） var内容=[]；函数可读文件（evt） { var reader=new FileReader（）； var检验 var file=evt.target.files[0]；如

下面的代码是我目前拥有的。我想在onload之外提醒（reader.result），但它总是返回null。reader.result不应该在readAsText（）被调用并完成后保留其结果吗？

更具体地说，我的最终目标是读取文件中的文本，然后将其保存在变量中以备将来使用。我只是将警报用作调试工具（我知道可能很糟糕）


var内容=[]；
函数可读文件（evt）
{
var reader=new FileReader（）；
var检验
var file=evt.target.files[0]；
如果（文件）
{
reader.onload=函数（元素）{
警报（“加载中”）；
this.result=element.target.result；
警报（reader.result）；
};
reader.onerror=函数（元素）{
警报（“reader.onerror已调用-无法加载”）；
};
reader.readAsText（文件）；
警报（reader.result）；
}
其他的
{
警报（“如果（文件）返回false-无法加载”）；
}
}
document.getElementById（'fileinput'）。addEventListener（'change'，readAFile，false）；


功能手柄文件选择（evt）
{
var files=evt.target.files；//文件列表对象
//循环浏览文件列表并将图像文件渲染为缩略图。
for（var i=0，f；f=files[i]；i++）
{
var reader=new FileReader（）；
reader.onload=（函数（reader）
{
返回函数（）
{
var contents=reader.result；
变量行=contents.split（'\n'）；
//////
document.getElementById（'container'）.innerHTML=contents；
}
})（读者）；
reader.readAsText（f）；
}
}
document.getElementById（'files'）.addEventListener（'change'，handleFileSelect，false）；

FileReader是异步的。因此，您在它读取任何内容之前调用了

alert（）

。@Barmar这是我最初的想法，但返回null的警报（reader.result）会在onload（返回实际结果）中的警报（reader.result）之后弹出。据我所知，警报是同步的，因此可以确认阅读已及时完成。我首先在Chrome中获得空警报@巴默是的，这里也是。延迟到onload完成运行的最佳方式是什么？在onload处理程序中执行您想要的任何操作，这就是重点。就像AJAX一样——当您启动一个异步操作时，使用它的回调等待它完成。

<input type="file" id="fileinput" />
<script type = "text/javascript" id="00">
    var contents = [];
    function readAFile(evt)
    {
        var reader = new FileReader();
        var test
        var file = evt.target.files[0];

        if (file)
        {

            reader.onload = function (element) {
                alert("in onload");
                this.result = element.target.result;
                alert(reader.result);
            };
            reader.onerror = function (element) {
                alert("reader.onerror called - could not load");
            };

            reader.readAsText(file);
            alert(reader.result);

        }
        else
        {
            alert("if(file) returned false - could not load");
        }

    }

    document.getElementById('fileinput').addEventListener('change', readAFile, false);

<!DOCTYPE html>
<html>

<input type="file" id="files" name="file" />
<div id="container" style="height: 500px; min-width: 500px"></div>

<script>
function handleFileSelect(evt)
{
    var files = evt.target.files; // FileList object

    // Loop through the FileList and render image files as thumbnails.
    for (var i = 0, f; f = files[i]; i++)
    {

        var reader = new FileReader();
        reader.onload = (function(reader)
        {
            return function()
            {
                var contents = reader.result;
                var lines = contents.split('\n');
                //////
                document.getElementById('container').innerHTML=contents;
            }
        })(reader);

        reader.readAsText(f);
    }
}
  document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>
</html>