File.webkitRelativePath

File.webkitRelativePath は、webkitdirectory 属性が設定された <input> 要素でユーザーが選択したディレクトリに対するファイルのパスを指定する USVString を含む読み取り専用のプロパティです。

構文

 relativePath = File.webkitRelativePath

値

ユーザーが選択した先祖ディレクトリを基準にしたファイルのパスを含む USVString。

例

この例では、ユーザーが1つまたは複数のディレクトリを選択できるディレクトリピッカーが提示されています。change イベントが発生すると、選択されたディレクトリ階層に含まれるすべてのファイルのリストが生成され、表示されます。

HTML コンテンツ

<input type="file" id="filepicker" name="fileList" webkitdirectory multiple />
<ul id="listing"></ul>

JavaScript コンテンツ

document.getElementById("filepicker").addEventListener("change", function(event) {
  let output = document.getElementById("listing");
  let files = event.target.files;

  for (let i=0; i<files.length; i++) {
    let item = document.createElement("li");
    item.innerHTML = files[i].webkitRelativePath;
    output.appendChild(item);
  };
}, false);

結果

仕様

この API には、公式の W3C または WHATWG 仕様はありません。

ブラウザの互換性

あわせて参照

• File and Directory Entries API
• HTMLInputElement.webkitEntries
• HTMLInputElement.webkitdirectory