代码不会运行,也不会显示任何错误

时间:2016-07-18 20:01:02

标签: javascript filereader

我完全不知道为什么我的代码不会运行。在控制台中没有错误。编辑:添加更多代码

<!DOCTYPE html>
  <meta charset="utf-8">
  <style>
    html {
      font-family: Helvetica, Arial, sans-serif;
      font-size: 100%;
      font color: white;
      background: #333;
    }

    #page-wrapper {
      width: 600px;
      background: #FFF;
      padding: 1em;
      margin: 1em auto;
      min-height: 300px;
      border-top: 5px solid #69c773;
      box-shadow: 0 2px 10px rgba(0, 0, 0, 0.8);
  }

  h1 {
    margin-top: 0;
  }

  #fileDisplayArea {
    margin-top: 2em;
    width: 100%;
    overflow-x: auto;
  }

  body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    width: 960px;
    height: 500px;
    position: relative;
  }
</style>

<body>
    <div id="page-wrapper">

        <h1>File to Matrix</h1>
        <div>
            Select a text file:
            <input type="file" id="fileInput">
        </div>
        <pre id="fileDisplayArea"><pre>

    </div>
</body>
<script>

    var data = []; //will hold data from file

    window.onload = function() {
        var fileInput = document.getElementById('fileInput');
        var fileDisplayArea = document.getElementById('fileDisplayArea');

        fileInput.addEventListener('change', function(e) {
            var file = fileInput.files[0];

            var reader = new FileReader();
            var str = '';
            reader.onload = function(e) {
                str = reader.result;
                alert("does this even ever run?");
                var temp = str.split('\n');
                for(var i = 0; i < temp.length; i++)
                    data.push(temp[i].split('\t'));
            }
            alert("this runs");
        });
    }
</script>

尝试读取用户选择的.tsv,并将数据转换为矩阵 线reader.onload = function(e){}不会运行,因为警报永远不会弹出,数据仍为空白。

感谢任何帮助。

由于

1 个答案:

答案 0 :(得分:0)

你刚刚失踪

reader.readAsText(file);

告诉读者实际阅读所选文件。

工作示例:https://jsfiddle.net/zck7z3aa/2/

我还添加了fileDisplayArea.innerHTML = reader.result;以在PRE标记中显示该文件的内容。