Html 如何在我自己的代码中使用 Google Chrome 11 的上传文件夹功能?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5826286/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I use Google Chrome 11's Upload Folder feature in my own code?
提问by Peter
Google Chrome 11 now supports uploading folders. Currently this feature is only implemented in Google Docs, and I have been unable to find any API documentation on how to use this in my code.
Google Chrome 11 现在支持上传文件夹。目前此功能仅在 Google Docs 中实现,我无法在我的代码中找到任何关于如何使用它的 API 文档。
From what I can see, you click the Upload folder link in Google Docs, which displays the "Browse For Folder" dialog (a call to SHBrowseForFolder by the looks of it), you select a folder, and then the contents of that folder is uploaded to Google Docs.
据我所知,您单击 Google Docs 中的上传文件夹链接,该链接显示“浏览文件夹”对话框(从外观上调用 SHBrowseForFolder),您选择一个文件夹,然后该文件夹的内容是上传到 Google 文档。
As this feature requires upgrading Google Chrome to the latest version, or for other browsers running a Java Applet, I assume I can use this feature in my own websites?
由于此功能需要将 Google Chrome 升级到最新版本,或者对于运行 Java Applet 的其他浏览器,我假设我可以在自己的网站中使用此功能?
I would love to have this feature in a Content Management System I maintain!
我希望在我维护的内容管理系统中拥有此功能!
回答by Kinlan
You should be able to see a demo here: http://html5-demos.appspot.com/static/html5storage/demos/upload_directory/index.html
您应该可以在这里看到演示:http: //html5-demos.appspot.com/static/html5storage/demos/upload_directory/index.html
Basically it works by setting up an attribute "webkitdirectory" on a file input element.
基本上它通过在文件输入元素上设置属性“webkitdirectory”来工作。
<input type="file" id="file_input" webkitdirectory="" directory="">
Then when the user has selected a folder, it itterates across the "e.target.files" object to get a list of files included in the selection (this enables you to have access to those files from the clientside).
然后,当用户选择一个文件夹时,它会遍历“e.target.files”对象以获取包含在选择中的文件列表(这使您可以从客户端访问这些文件)。
Drag and drop is similar, when you listen to the "ondrop" event on a "draggable" element, if a a directory or selection of files is dropped on to the element, the "files" property on the event will be a list of files contained in the operation.
拖放类似,当您在“可拖动”元素上侦听“ondrop”事件时,如果将目录或选择的文件拖放到该元素上,则事件上的“文件”属性将是文件列表包含在操作中。