具有文件名路径的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屋！