如何让用户使用 javascript 在其本地计算机上选择一个文件夹(而不是文件）

How can I have a user select a folder (not a file) on their local machine using javascript?

本文关键字：选择 一个 文件夹 文件 计算机 用户 javascript      更新时间：2023-09-26

我有一个基于 Web 的应用程序，我需要能够从中弹出"文件打开"对话框并让用户选择一个文件夹，然后将其路径填充到 HTML 表单字段中，以便用户不必键入它。

不上传任何文件或文件夹，仅上传路径信息。

客户端平台/环境是带有 Internet Explorer 11 的 Windows 7，或者可选的 OS X 上的 Safari（最新版本）。它不能使用Java，Flash或任何其他必须下载和安装的插件 - 只能使用默认情况下安装在这些平台上的插件，例如Windows上的ActiveX。

我发现这段代码几乎可以满足我的需要 - 但我无法弄清楚如何允许它选择一个文件夹而不仅仅是一个非文件夹文件：

<html>
    <head>
    <script type="text/javascript" language="JavaScript">
    if (typeof String.prototype.startsWith != 'function') {
      // see below for better implementation!
      String.prototype.startsWith = function (str){
        return this.indexOf(str) == 0;
      };
    }
    function getUNCPath() {
        var fileName = document.getElementById("uploadedFile").value;
        var WshNetwork = new ActiveXObject("WScript.Network");
        var Drives = WshNetwork.EnumNetworkDrives();
        for (i = 0; i < Drives.length; i += 2) {
            if (fileName.startsWith(Drives.Item(i))) {
                var fullPath = fileName.replace(Drives.Item(i), Drives.Item(i + 1));
                alert(fullPath);
                break;
            }
        }
    }
    </script>
    </head>
    <body>
        <form onsubmit="getUNCPath()">
            <input type="file" id="uploadedFile"/>
            <input type="submit" value="Get the UNC Path!" />
        </form>
        <span id="uncPath"></span>
    </body>
</html>

我假设我需要使用文件 API，但我的 Google-fu 无法找到一种通过文件 API 单独检索文件夹名称的方法。

出于安全原因，您无法执行此操作，某些浏览器甚至会为您提供虚假的目录信息。浏览器不允许您使用 javascript 访问和浏览客户端计算机的文件系统。

文件 API 对此进行验证

文件的名称;在获取时，它必须返回 文件作为字符串。不同的文件名有许多变体 系统;这只是文件的名称，没有路径 信息。在获取时，如果用户代理无法提供此信息 可用，它们必须返回空字符串。

相关文章：