如何用Javascript加载本地文件

How to load a local file in Javascript

本文关键字:文件 加载 何用 Javascript      更新时间:2024-05-14

我有一个名为dump.json的文件,格式为:

[{"key": "XYZ", "values": [[1424642400000, 28], [1424728800000, 80], [1424815200000, 92]]}]

而且,我想做的是以某种方式在JavaScript中以变量名histcatexplong:加载它

var histcatexplong = [{"key": "XYZ", "values": [[1424642400000, 28], [1424728800000, 80], [1424815200000, 92]]}];

我该怎么做?

正如我在评论中所说,这可以在线和离线使用(不需要Web服务器),而XMLHTTPRequest可以。请注意,Filereader仅在现代浏览器中受支持。http://caniuse.com/#feat=filereader

  function readSingleFile(evt) {
    var f = evt.target.files[0]; 
    if (f) {
      var r = new FileReader();
      r.onload = function(e) { 
	      var contents = e.target.result;
       document.querySelector("div").innerHTML=  "Got the file.n" 
              +"name: " + f.name + "n"
              +"type: " + f.type + "n"
              +"size: " + f.size + " bytesn"
              + "starts with: " + contents
           //store it as JSON
           histcatexplong = JSON.parse(contents);
      }
      r.readAsText(f);
    } else { 
      alert("Failed to load file");
    }
  }
  document.getElementById('fileinput').addEventListener('change', readSingleFile, false);
<input type="file" id="fileinput" />
<div></div>

作为我意思的一个例子。

我只需向.json文件发送一个不带参数的GET请求。请注意,以下代码示例在IE5/IE6中不起作用。请查看此答案以获得更跨浏览器的解决方案,并且由于同源策略,必须在服务器(例如localhost)上运行。一个粗略的想法:

 var histcatexplong;
 var xhReq = new XMLHttpRequest();
 xhReq.open("GET", "dump.json", true);
 xhReq.send(null);
 xhReq.onreadystatechange=function()
 {
  if (xhReq.readyState==4 && xhReq.status==200)
      histcatexplong=JSON.parse(xhReq.responseText);
 }