时间戳

首页 > 解决方案 > 尝试在 HTML 页面加载时读取本地文件

javascript - 尝试在 HTML 页面加载时读取本地文件

问题描述

我正在创建一个引用本地 txt（或 csv）文件的 Web 应用程序，该文件每年都会更改。我希望能够将文件的内容加载到<textarea>页面启动中。

现在，我有<textarea>使用<input>元素将内容加载到 a 中的功能代码（感谢 2015 年的 StackOverflow 问题）。文件被选中，一旦输入状态发生变化，事件监听器将调用一个函数。我的挑战是修改代码，以便文件可以在启动时进行硬编码和加载，并且仍然使用事件调用函数（或将函数更改为在没有事件调用的情况下工作）。

索引.html

    <input type="file" id="fileinput" />
    <script type="text/javascript" src="dataLoad.js"></script>
    <script type="text/javascript">
    document.getElementById('fileinput').addEventListener('change', readSingleFile, false);
    </script>
    <textarea rows=20 id="area"></textarea>

数据加载.js

function readSingleFile(evt) {
    //Retrieve the first (and only!) File from the FileList object
    var f = evt.target.files[0]; 
    if (f) {
        var r = new FileReader();
        r.onload = function(e) {
          var display = "";
          //a lot of unimportant stuff here
          document.getElementById('area').value = display;
        }

        r.readAsText(f);

    } else { 
        alert("Failed to load file");
    }
}

这工作正常，但我不想手动选择要加载的文件，我想对文件进行硬编码。“这里有很多不重要的东西”会解析文件中的数据，所以为了清楚起见，我把它省略了。

标签： javascripthtmlfile-upload

解决方案

由于安全原因，您不能。

您不希望您访问的网站能够做到这一点，是吗？

尝试这个：

 <object width="300" height="300" type="text/plain" data="password.txt" border="0" >
</object

推荐阅读