Javascript解析文本数据错误?

Javascript parsing text data error?

我正在尝试从我的本地目录中解析一些数据。 我使用 papa 解析器来做到这一点。 问题是我无法将文本文件分配给变量。我收到此错误 ;

未捕获类型错误:无法在 'FileReader' 上执行 'readAsText':参数 1 不是 'Blob' 类型。

我已经搜索过了,我发现这是在使用 HTML file reader 读取文件时的一个非常常见的错误。

我的密码是;

<!doctype html>
<html class="no-js" lang="">
    <head>
        <script src="https://github.com/mholt/PapaParse/blob/master/papaparse.js"></script>
        <meta charset="utf-8">
        <meta http-equiv="x-ua-compatible" content="ie=edge">
        <title>Parse Example</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="css/normalize.css">
        <link rel="stylesheet" href="css/main.css">
        <script src="js/vendor/modernizr-2.8.3.min.js"></script>
    </head>
    <p>Click the button to Upload .</p>
    <button onclick="myFunction()" type="INPUT">Load</button>
    <input type="file" name="datafile" size="40">
    <script>
        var x;
        var config = {
            delimiter: "", // auto-detect
            newline: "", // auto-detect
            header: true,
            dynamicTyping: false,
            preview: 0,
            encoding: "",
            worker: false,
            comments: false,
            step: undefined,
            complete: undefined,
            error: undefined,
            download: true,
            skipEmptyLines: false,
            chunk: undefined,
            fastMode: undefined,
            beforeFirstChunk: undefined,
            withCredentials: undefined
        };
        function myFunction() {
            x = document.getElementsByName("datafile");
            myfile =  Papa.parse(x, config);
            document.getElementById("demo").innerHTML = myfile;
        }
    </script>
    <p id="demo"></p>
    </body>
</html>

  1. getElementsByName returns 总是 returns 匹配元素的节点列表集合,所以基本上你可以只 select 第一个:x = document.getElementsByName("datafile")[0]

  2. Papa.parse 期望它的第一个参数是字符串或 File 对象。 File 对象可以从FileList 中获取,它存储在files 属性 的文件输入中。所以基本上(如果文件在输入中被 select 编辑,它应该可以工作): x = document.getElementsByName("datafile")[0].files[0]

  3. 正如 documentaion 所说 Papa.parse 本身没有 return 任何东西,您应该提供回调以获取数据。因此,如果您将 config 对象中的 complete: undefined 替换为

    complete: function(data) {
        console.log(data);
    }
    

    您将在浏览器控制台中显示您的数据。