最近做一个小项目，前端需要有一个功能是点击某按钮时，弹出文件选择的框，然后获取目录并写入对应的输入框里，以往是选择某个文件进行上传，功能看起来有些像，但这次不同的是只能选择某个目录而不是文件，因为它并不是上传，它只是为了选择后台生成的文件保存的路径。 于是网上查解决方案，查到两种， 一种是仅在谷歌浏览器上有效的方式，在input节点里加一个属性 webkitdirectory，就可以实现点击弹出选择目录的功能，然后就可以截取目录，此种方式对非空文件夹是可以的实现的，只需监听此input的change事件即可，但如果选择的是空文件夹，就不会触发事件，就无法获取路径，所以这方法不复合我的需求。 另一种是只适用于IE浏览器的方式，即调用IE的activeX控件，为点击按钮绑定事件，然后就可以获取目录，然后到目录调到想要的地方即可，具体实现方式是： <input id="show"> <button onclick="clickBtn()">点击</button> function click() { try { var Message = "\u8bf7\u9009\u62e9\u6587\u4ef6\u5939" //选择框提示 var Shell = new ActiveXObject("Shell.Application") var Folder = Shell.BrowseForFolder(0, Message, 64, 17) //起始目录为：我的电脑 //var Folder = Shell.BrowseForFolder(0, Message, 0) //起始目录为：桌面 if (Folder != null) { Folder = Folder.items() // 返回 FolderItems 对象 Folder = Folder.item() // 返回 Folderitem 对象 Folder = Folder.Path // 返回路径 if (Folder.charAt(Folder.length - 1) != "\\") { Folder = Folder + "\\" } document.getElementById('show').value = Folder return Folder } } catch (e) { alert(e.message)} } 但些方式也有一个问题是，此控件是默认关闭的，需要用户手动启用，并且要把本站点加入可信任站点才行，具体设置过程是： 1. 单击菜单工具->Internet选项->安全->受信任站点->站点->把此网站设为可信站点 2. 在自定义级别->对没有标记为安全的ActiveX控件进行初始化和脚本运行"----"启用"出于安全原因, js不能访问客户端资源. 所以js写不了客户端文件. 使用file类i-n-p-u-t标签可以在浏览器上实现浏览客户端文件系统, 但是只能获取文件名, 路径对于js是不可见的. 所以你的方法是实现不了的.
实现导出文件的通常做法是在后台生成好文件后, 将url重定向到已生成的文件或使用异步方法返回文件url在前台使用i-f-r-a-m-e打开, 这样就能直接下载. 之后根据客户端的设置, 是下载还是直接调用关联程序打开文档. 以xls文件为例, 客户端已安装office, 大多数浏览器是会直接代开该文件的, 可以在excel中另存到任意路径. 不过这些就不是js所能控制的了.
后台代码实现方面, 直接在网站目录下生成文件当然方便, 但是存在安全方面的问题, 因为静态url无法控制访问权限. 最好是将文件生成在网站文件系统意外的独立区域存储, 将下载事务包装成动态页面, 读取文件使用b-i-n-a-r-y方式写入r-e-s-p-o-n-s-e(注意根据文件类型正确写入c-o-n-t-e-n-t Type, 这样浏览器才能正确识别为文件下载). 这样做的好处显而易见, 不管是安全方面还是其他逻辑都可自由扩展.
尼玛, 好多禁用的词汇, 回答js相关的问题各种河蟹
