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
(...)

したがって、スラッシュが 1 つあるファイルのみが必要です (つまり、サブディレクトリではなく、選択したディレクトリの直下にあるファイル)。

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 に答える