在Chrome中加载文件时,FileReader readyState停留在1

时间:2017-10-30 20:17:17

标签: javascript google-chrome filereader

我在我的网络应用程序中使用FileReader来读取用户选择的本地文件,当我读取AsText()时,readyState应该更改为' 2'一旦完成。这是我的代码:

        var fr = new FileReader(); // readyState is 0
        var filetoload = $("#foo")[0].files[0];
        fr.readAsText(filetoload); // readyState should be 2!!
        var xml = fr.result; 
        localStorage.setItem('foo', xml);

现在在Firefox中,这一切都运行正常,xml被写入localStorage就好了。如果我在控制台中以静止状态执行此操作(假设#foo输入中指定了文件),那么它也可以正常工作。但是如果我从我的.jsp文件中的脚本标记正常运行,则在上面的第3行之后readyState = 1(!)。并且,如果我在第3行放置一个断点,然后尝试从控制台读取AsText(),它也会设置readyState = 1。

Chrome在执行期间需要完全读取文件?我究竟做错了什么?只有在控制台中处于静止状态时,它才能在Firefox和Chrome中运行,这让我相信Chrome需要更多内容才能允许这样或那样的事情。感谢任何见解,谢谢。

1 个答案:

答案 0 :(得分:1)

我能够从this post找到答案。由于读取文件是异步发生的,我想我需要相应地处理。以下是对我有用的。 (jsonCall()只是我们基本上调用$ .ajax的内部函数)我希望将来可以帮助某人。

    $(document).ready(function(){
        $('#foo').on('click', function(e){
            readFile($("[name='filelocation']")[0].files[0], function(e) {
                // use e.target.result in callback...
                var data = { "xml" : e.target.result };
                jsonCall("myservlet", data, function() {
                    window.open(url, "_blank", "height=800,width=1200");
                })
            });
        });
    });

    function readFile(file, onLoadCallback)
        {
        var fr = new FileReader();
        fr.onload = onLoadCallback;
        fr.readAsText(file);
        }