2

我正在尝试读取用户使用以下命令选择的给定目录中的所有目录：

<input type="file" id="directory-chooser" webkitdirectory directory/>

一旦用户选择了所需的文件夹。我可以使用以下方法获取所有文件：

var files = document.getElementById('directory-chooser').files;
console.log(files);

其输出形式为：

2: File
   lastModifiedDate: Mon Jun 17 2013 17:55:45 GMT+0100 (BST)
   name: "."
   size: 68
   type: ""
   webkitRelativePath: "Movies/Superman returns/."
   length: 3

可以看出，在选择名为 的目录Movies时，我得到了其中所有“文件”的列表。但是，我只是希望它停止查看子目录并返回Superman returns结果。虽然我希望它继续寻找更多的一级目录，如果有的话。

4

1 回答 1

2

您可以计算每个文件路径中“/”的数量。如果用户选择文件夹“foo”，则返回文件的路径为：

foo/bar.txt
foo/bar/baz.txt
(...)

因此，您只需要具有一个正斜杠的文件（即它们直接位于所选目录下，而不是子目录中）。

这是HTML代码：

<input type="file" id="directory-chooser" webkitdirectory directory/>
<input type="button" value="files" onclick="showFiles()">

这是JS代码：

function showFiles() {
  var files = document.getElementById('directory-chooser').files;
    for (i = 0; i < files.length; i++) {
        if (files[i].webkitRelativePath.match(/\//g).length == 1) {
            // The file in question is not in a subfolder, so show it
            console.log(files[i]);
        }
    }
}

最后，这是一个有效的 jsFiddle：

http://jsfiddle.net/BHSDa/

于 2013-06-20T09:38:29.583 回答