web-dev-qa-db-ja.com

HTML入力タイプ「ファイル」またはその他の方法からフォルダーディレクトリを取得する方法

タイプ"file"の基本的なフォーム入力がありますが、ユーザーがファイルではなくフォルダーの場所を選択できるようにします。

ファイルではなくフォルダーを選択するためにこの入力を取得するにはどうすればよいですか、または別の方法がありますか？

htmlfileinputdirectory
56
Ben

このページでも偶然見つけました。そして、これはjavascript（ActiveXやFlashのようなプラグインはありません）だけで、クロームだけで可能であることがわかりました。

https://plus.google.com/+AddyOsmani/posts/Dk5UhZ6zfF

基本的に、ファイル入力要素「webkitdirectory」に新しい属性のサポートを追加しました。次のように使用できます。

<input type="file" id="ctrl" webkitdirectory directory multiple/>

ディレクトリを選択できます。 multiple属性は、ディレクトリ選択ではなく複数のファイル選択をサポートするブラウザーに適したフォールバックです。

ディレクトリを選択すると、複数の属性を使用する場合と同様に、コントロールのdomオブジェクト（document.getElementById（ 'ctrl'））を介してファイルを使用できます。ブラウザは、選択したディレクトリ内のすべてのファイルをそのリストに再帰的に追加します。

ある時点でこれが標準化された場合に備えて、すでにディレクトリ属性を追加することもできます（それに関する情報が見つかりません）。

60
bwindels

ほとんどの場合、flash/silverlight/activeXコントロールの使用を検討しています。 <input type="file" />コントロールはそれを処理しません。

ユーザーがディレクトリを取得する手段としてファイルを選択することを気にしない場合は、そのコントロールのchangeイベントにバインドし、ファイル名の部分を削除してパスをどこかに保存できますが、それは約それが得られるように良い。

Webページはサーバーと対話するように設計されていることに注意してください。ローカルディレクトリをリモートサーバーに提供することは、「典型的」ではありません（サーバーがアクセスできないので、なぜそれを要求するのですか？）。ただし、ファイルは選択的に情報を渡す手段です。

2
Brad Christie

それは古い質問ですが、これは誰かを助けるかもしれません。

「複数」を使用してファイルを参照しながら、複数のファイルを選択できます

<input type="file" name="datafile" size="40"  multiple>
2
Sai