我试图打开文件
window.open("file:///D:/Hello.txt");
浏览器不允许以这种方式打开本地文件，可能是出于安全原因。我想在客户端使用文件的数据。如何在 JavaScript 中读取本地文件？
如何使用 JavaScript 打开本地磁盘文件？
IT技术
javascript
2021-02-08 08:30:05
6个回答
这是一个使用示例FileReader：
function readSingleFile(e) {
var file = e.target.files[0];
if (!file) {
return;
}
var reader = new FileReader();
reader.onload = function(e) {
var contents = e.target.result;
displayContents(contents);
};
reader.readAsText(file);
}
function displayContents(contents) {
var element = document.getElementById('file-content');
element.textContent = contents;
}
document.getElementById('file-input')
.addEventListener('change', readSingleFile, false);<input type="file" id="file-input" />
<h3>Contents of the file:</h3>
<pre id="file-content"></pre>眼镜
http://dev.w3.org/2006/webapi/FileAPI/
浏览器兼容性
- 浏览器 10+
- 火狐 3.6+
- 铬 13+
- Safari 6.1+
在HTML5的FileReader设施确实允许您处理本地文件，但这些必须由用户来选择，你不能去生根关于用户硬盘寻找文件。
我目前在 Chrome (6.x) 的开发版本中使用它。我不知道其他浏览器支持它。
因为我没有生命，我想要这 4 个声望点，所以我可以向真正擅长编码的人表达我的爱（支持答案）我分享了我对Paolo Moretti代码的改编。只需使用openFile(将文件内容作为第一个参数执行的函数)。
function dispFile(contents) {
document.getElementById('contents').innerHTML=contents
}
function clickElem(elem) {
// Thx user1601638 on Stack Overflow (6/6/2018 - https://stackoverflow.com/questions/13405129/javascript-create-and-save-file )
var eventMouse = document.createEvent("MouseEvents")
eventMouse.initMouseEvent("click", true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null)
elem.dispatchEvent(eventMouse)
}
function openFile(func) {
readFile = function(e) {
var file = e.target.files[0];
if (!file) {
return;
}
var reader = new FileReader();
reader.onload = function(e) {
var contents = e.target.result;
fileInput.func(contents)
document.body.removeChild(fileInput)
}
reader.readAsText(file)
}
fileInput = document.createElement("input")
fileInput.type='file'
fileInput.style.display='none'
fileInput.onchange=readFile
fileInput.func=func
document.body.appendChild(fileInput)
clickElem(fileInput)
}Click the button then choose a file to see its contents displayed below.
<button onclick="openFile(dispFile)">Open a file</button>
<pre id="contents"></pre>尝试
function readFile(file) {
return new Promise((resolve, reject) => {
let fr = new FileReader();
fr.onload = x=> resolve(fr.result);
fr.readAsText(file);
})}
但用户需要采取行动来选择文件
这里的其他人为此提供了非常详细的代码。也许当时需要更详细的代码，我不知道。无论如何，我对其中一个投了赞成票，但这里有一个非常简化的版本，它的工作原理相同：
function openFile() {
document.getElementById('inp').click();
}
function readFile(e) {
var file = e.target.files[0];
if (!file) return;
var reader = new FileReader();
reader.onload = function(e) {
document.getElementById('contents').innerHTML = e.target.result;
}
reader.readAsText(file)
}Click the button then choose a file to see its contents displayed below.
<button onclick="openFile()">Open a file</button>
<input id="inp" type='file' style="visibility:hidden;" onchange="readFile(event)" />
<pre id="contents"></pre>