Question

我想显示上传文本文件的内容，它可以正常工作。但我不知道为什么files[0]属性为textfile。我尝试搜索互联网，但没有结果。

<center>
    <input id="textfile" type="file">
    <input id="upload" type="submit" value="Upload">
</center>

<script type="text/javascript">
    var textfile = document.getElementById("textfile");
    var upload = document.getElementById("upload");

    upload.addEventListener("click",function () {
        var fileReader = new FileReader();
        fileReader.readAsText(textfile.files[0]);
        fileReader.onload = function (event) {
            alert(event.target.result);
        }
    });
</script>

Answer 1

files属性包含<input type="file">元素中选择的文件列表。它是一个列表，因为您可以使用multiple属性来允许用户选择多个文件;如果没有此选项，则唯一选定的文件将始终位于files[0]中。它是一个FileList，类似于数组，因此您可以使用普通的数组索引语法访问元素。对单个和多个文件选择器使用相同的表示可以使处理输入的代码保持一致 - 您不必担心单个.file属性还是{{{ 1}}带有列表的属性。

每个元素都是一个File对象，其中包含有关所选文件的信息。您可以将其传递给.files API以访问文件内容。

Answer 2

根据mozilla开发者网站，

通常从返回的FileList对象中检索文件对象由于用户使用该元素选择文件。

因此即使不是多个，File API也会使用一个元素获取数组本身。

带文件类型的输入标记的files属性是什么？

2 个答案: