具有文件名路径的HTML5文件API [英] HTML5 File API with filename path
问题描述
我有以下代码通过HTML5 File API读取文件。我已经通过
input = file element上传了该文件。以下是代码块。
I have following code to read file through HTML5 File API. I have uploaded the file via input=file element. Following is the code block.
<input type="file" id="files" name="file" />
<button id="readFile">Read File</button>
<output id="content"></output>
<script>
function readFile()
{
/* Get the reference of the inpout element. */
var files = document.getElementById('files').files;
console.log(files);
if (!files.length)
{
alert('Please select a file!');
return;
}
/* Reading the first file selected. You can process other files similarly in loop. */
var file = files[0];
/* Instantiate the File Reader object. */
var reader = new FileReader();
/* onLoad event is fired when the load completes. */
reader.onload = function(event) {
document.getElementById('content').textContent = event.target.result;
};
/* The readAsText method will read the file's data as a text string. By default the string is decoded as 'UTF-8'. */
reader.readAsText(file);
}
document.getElementById('readFile').addEventListener('click', function(event) {
readFile();
}, false);
</script>
如果我不想上传文件并通过input = type元素提供文件路径到HTML5怎么办? :文件API读取文件并显示它?
What if I don't want to uploaded the file and provide filepath via input=type element to HTML5: File API to read the file and display it?
我知道HTML5:File API不采用直接文件路径。是否有任何解决方案?
I know that the HTML5: File API don't take direct file path. Is there any solution ?
推荐答案
出于安全原因,浏览器不允许访问绝对路径&文件系统直接转到Javascript。您只能通过在javascript中调用'val()'函数来获取文件名,仅此而已。
For Security reason, the browsers does not allow access to absolute path & file systems directly to Javascript. You can only get the file name by calling the 'val()' function in javascript and nothing more.
所以不要浪费时间。
这篇关于具有文件名路径的HTML5文件API的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!