File对象中的webkitRelativePath属性的用途是什么？ [英] What is the purpose of webkitRelativePath property in File object?

问题描述

如果您使用类似以下的简单内容在Chrome控制台中打印文件对象：

If you printout File object in Chrome console with something simple like this:

<input type="file" onchange="console.info(this.files);" />

除了其他属性外，您还将看到始终为空的 webkitRelativePath 属性：

you will see among other properties an always empty webkitRelativePath property:

fileName: "07.png"
fileSize: 33022
lastModifiedDate: Date
name: "07.png"
size: 33022
type: "image/png"
webkitRelativePath: ""
__proto__: File

目的是什么？以及如何利用它？

What is it's purpose? And how it can be leveraged?

推荐答案

使用 webkit目录在文件输入中的属性：

It's populated when using the webkitdirectory attribute on the file input:

<input type="file" webkitdirectory>

仅适用于Chrome。这允许用户选择一个文件夹而不是文件，并且递归地读取每个文件。 webkitRelativePath 包含层次结构中文件的相对路径。

It only works in Chrome. This allows a user to select a folder rather than files, and every file is read recursively. The webkitRelativePath contains the relative path of the file within the hierarchy.

有一个演示此处。

这篇关于File对象中的webkitRelativePath属性的用途是什么？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！