HTML页面中的目录选择器


70

如何在html页面中创建目录选择器。
如果我使用输入文件元素,则只能选择文件,但是我需要选择目录。
我需要执行此操作,因为用户应在计算机内选择正确的路径。
有什么解决办法吗?


2
现在有可能使用HTML5,至少在chrome中:stackoverflow.com/questions/24718769/…–
mtyson

请查看此链接:在此处输入链接描述
hhaseli

Answers:


34

出于安全原因,无法使用纯HTML / JavaScript完成。

选择要上传的文件是您的最佳选择,即使那样,您也无法在现代浏览器中获得其完整的原始路径。

您可能可以使用Java或Flash将某些内容放在一起(例如,使用SWFUpload为基础),但这需要大量工作,并且会带来其他兼容性问题。

另一个想法是打开一个iframe显示用户C:驱动器(或其他内容)的显示,但是即使现在有可能(出于安全原因可能被阻止,很长时间没有尝试过),您的网站也无法与iframe通信(再次出于安全原因)。

您需要什么呢?


1
我需要它来选择计算机内部的路径,而不是上传。我使用此路径来保存文件,但是具有JSP功能。

2
@enfix您如何将文件从JSP服务器保存到用户本地计算机上的某个路径中?我不明白 您可以编辑您的问题进行澄清吗?
Pekka 2010年

1
我需要获取用户想要保存文件的路径,但是文件是通过JSP页面内的java函数callend保存的。此功能需要保存文件的路径。就这样。我保存了多个文件,我需要使用此Java函数创建文件夹和其他内容。

9
@修复,您无法从服务器将文件保存在客户端计算机上。这是完全不可能的。您必须将文件作为常规文件下载来提供,然后浏览器将为用户提供选择目录以将文件保存在其中。但是,这完全超出了您的控制范围。您不能影响过程的那部分。
Pekka 2010年

2
@Pekka웃他需要什么有什么关系
user3808307

74

试试这个,我认为它将为您工作:

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

您可以在https://plus.google.com/+AddyOsmani/posts/Dk5UhZ6zfF3上 找到此示例,如果需要更多信息,可以在此处找到 。


6
我的印象是您的建议适用于上传文件夹,而不是获取其路径。
Lazarus Rising

developer.mozilla.org/zh-CN/docs/Web/API/HTMLInputElement/…以获取文档。它被称为non-standard。并且它有效地递归上载包含的文件(?),同时公开文件夹名称。这将在大多数情况下适用
phil294

@SamithaChathuranga现在在Chrome中,至少65版的
XLM

3

如果您是服务器和用户(例如,您正在创建通过浏览器运行的应用程序,并且需要选择一个文件夹),则JFileChooser在浏览器中单击某些按钮时尝试从服务器调用

JFileChooser chooser = new JFileChooser();
chooser.setCurrentDirectory(new java.io.File("."));
chooser.setDialogTitle("select folder");
chooser.setFileSelectionMode(JFileChooser.DIRECTORIES_ONLY);
chooser.setAcceptAllFileFilterUsed(false);

这段代码摘自这里


2

脚本编写是不可避免的。

由于存在安全风险,因此未提供。<input type='file' />最接近,但不是您要找的东西。

签出使用Javascript实现您想要的示例

如果操作系统是Windows,则可以使用VB脚本访问核心控制文件以浏览文件夹。


1

我做了一个工作。我有一个隐藏的文本框来保存值。然后,在form_onsubmit上,我将路径值(减去文件名)复制到了隐藏文件夹中。然后,将fileInput框设置为“”。这样就不会上传任何文件。我不记得fileUpload控件的事件。也许在变化。有一阵子了。如果有值,我将解析出文件名,然后将文件夹放回框中。当然,您需要确认该文件为有效文件。这将为您提供客户端工作站文件夹。
但是,如果要反映服务器路径,则需要使用完全不同的编码方法。


必须训练用户选择任何文件。糟透了。但是,在紧要关头工作。将onchange =“ parseFilePath()”添加到FileUpload控件。函数parseFileUploadPath(){var upl = document.getElementById(“ <%= this.FileUpload1.ClientID%>”); 如果(upl.value!=“”){var pos = upl.value.lastIndexOf(“ \\”)document.getElementById(“ <%= this.TextBox1.ClientID%>”)。value = upl.value.substr (0,pos)}}
user8004777

抱歉,更完整的HTML。
user8004777

0

如果您没有太多文件夹,那么我建议您使用if语句根据用户输入的详细信息来选择上载文件夹。例如

String user= request.getParameter("username");
if (user=="Alfred"){
//Path A;
}
if (user=="other"){
//Path B;
}
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.