HTMLInputElement: webkitEntries プロパティ

webkitEntriesHTMLInputElement インターフェイスの読み取り専用プロパティで、ユーザーが <input> 要素の file 型を用いて選択したファイルやディレクトリーを表す、ファイルシステムの項目(FileSystemEntry に基づくオブジェクト)の配列を含みます。その選択がドラッグ & ドロップで行われた場合にのみ、ダイアログ内でファイルを選択しても、プロパティは空になります。

webkitdirectory プロパティが true である場合のみ、配列が入ることがあります。これは、 <input> 要素でユーザーがディレクトリーを選択することができることを意味します。

メモ: このプロパティは仕様書で webkitEntries と呼ばれていますが、これはもともと Google Chrome 独自の API であったためです。いつか改名される可能性があります。

FileSystemEntry に基づいたオブジェクト配列で、それぞれの要素が <input> 要素で選択されたファイルを表します。具体的には、ファイルは FileSystemFileEntry オブジェクトで表現され、許可されていれば、ディレクトリーは FileSystemDirectoryEntry オブジェクトで表されます。

この例では、ファイル選択 <input> 要素を作成し、選択されたファイルを処理する方法を示しています。

HTML

html
<input id="files" type="file" multiple />

JavaScript

js
document.getElementById("files").addEventListener("change", (event) => {
  event.target.webkitEntries.forEach((entry) => {
    /* do stuff with the entry */
  });
});

change イベントが発生するたびに、このコードは選択されたファイルリストを走査して、 FileSystemEntry ベースのオブジェクトを取得し操作をします。

仕様書

Specification
File and Directory Entries API
# dom-htmlinputelement-webkitentries

ブラウザーの互換性

BCD tables only load in the browser

関連情報