我正在尝试获取文件的完整路径,该文件是通过拖放操作进行检索的。但是问题是,出于安全原因,浏览器不允许这样做。.::((
所以我的问题是:
是否有可能在拖放文件时在使用过程中将其在线上载,因此是暂时的(因为我使用d3.json来恢复文件,并且它允许我在线上恢复json文件。),以及在使用结束时删除在线文件,也就是说,在关闭选项卡时会删除??
再次感谢您的帮助。
答案 0 :(得分:3)
您不需要文件的完整路径即可读取其内容,并且我相信d3允许您直接提供数据,而不是从“文件”中读取数据(大概是从URL中读取)。
只需使用FileReader
进行阅读。例如,在change
上的input type="file"
处理程序中:
var file = theInput.files[0];
var fr = new FileReader();
fr.onload = function() {
// Use fr.result here, it's a string of the file's contents.
// If it's JSON and you want the data in the form `d3.json` would have
// provided it, do: `var data = JSON.parse(fr.result);`
// and then use `data`.
};
fr.readAsText(file);
实时示例(仅读取文件,不将数据传递给d3):
document.querySelector("input[type=file]").addEventListener("change", function() {
var file = this.files[0];
var fr = new FileReader();
fr.onload = function() {
console.log("Done");
var pre = document.getElementById("output");
pre.innerHTML = "";
pre.appendChild(
document.createTextNode(fr.result)
);
};
fr.onerror = function() {
console.log("Error reading the file");
};
console.log("Reading...");
fr.readAsText(file);
});
pre {
border: 1px solid black;
padding: 2px;
}
<input type="file">
<hr>
Contents:
<pre id="output"></pre>