javascript Web上传文件夹的两种解决方案

解决方案1:
调用windows的shell,但会有安全问题.

* browseFolder.js
* 该文件定义了BrowseFolder()函数,它将提供一个文件夹选择对话框
* 以供用户实现对系统文件夹选择的功能
* 文件夹选择对话框起始目录由
* Shell.BrowseForFolder(WINDOW_HANDLE, Message, OPTIONS, strPath)函数
* 的strPath参数设置
* 例如:0x11--我的电脑
* 0 --桌面
* "c:\\"--系统C盘

*
* 用如下代码把该函数应用到一个HTML文件中:
* <script src="browseFolder.js"></script>
* 或把下面代码直接COPY到<script language="javascript">...</script>标签中;

* 特别注意的是,由于安全方面的问题,你还需要如下设置才能使本JS代码正确运行,
* 否者会出现"没有权限"的问题.

*
* 1、设置可信任站点(例如本地的可以为:http://localhost)
* 2、其次:可信任站点安全级别自定义设置中:设置下面的选项
* "对没有标记为安全的ActiveX控件进行初始化和脚本运行"----"启用"

Js代码 收藏代码
  1. /***
  2. path要显示值的对象id
  3. ****/
  4. functionbrowseFolder(path){
  5. try{
  6. varMessage="\u8bf7\u9009\u62e9\u6587\u4ef6\u5939";//选择框提示信息
  7. varShell=newActiveXObject("Shell.Application");
  8. varFolder=Shell.BrowseForFolder(0,Message,64,17);//起始目录为:我的电脑
  9. //varFolder=Shell.BrowseForFolder(0,Message,0);//起始目录为:桌面
  10. if(Folder!=null){
  11. Folder=Folder.items();//返回FolderItems对象
  12. Folder=Folder.item();//返回Folderitem对象
  13. Folder=Folder.Path;//返回路径
  14. if(Folder.charAt(Folder.length-1)!="\\"){
  15. Folder=Folder+"\\";
  16. }
  17. document.getElementById(path).value=Folder;
  18. returnFolder;
  19. }
  20. }
  21. catch(e){
  22. alert(e.message);
  23. }
  24. }

使用的时候:

Js代码 收藏代码
  1. <td>
  2. <inputtype="text"name="path"/>
  3. </td>
  4. <td>
  5. <inputtype="button"onclick="browseFolder('path')"
  6. value="选择生成路径"/>
  7. </td>

2.解决方案二:
自己写一个js读取本地硬盘的选择框, 缺点是外观上较上一个差一些.

Js代码 收藏代码
  1. <html>
  2. <head>
  3. <metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
  4. <title>无标题文档</title>
  5. </head>
  6. <body>
  7. <tableborder="0"cellpadding="0"width="100%"id="tb_show">
  8. <tr>
  9. <tdwidth="18%">文件保存位置:</td>
  10. <tdwidth="82%">
  11. <%--<html:fileproperty="file"size="40"styleClass="inputbox"/>--%>
  12. <inputname="backDir"type="text"value="C:\"size="100"width="500">
  13. </td>
  14. </tr>
  15. <tr>
  16. <td>目录位置:</td>
  17. <td>
  18. <selectname="tables_drive"id="tables_drives"onchange="get_drives()"></select>
  19. </td>
  20. </tr>
  21. <tr>
  22. <tdcolspan="2">
  23. <selectname="table_folder"id="table_folder"size="10"multipleondblclick="get_file()"></select>
  24. </td>
  25. </tr>
  26. <tr>
  27. <tdcolspan="2">
  28. <fontcolor="red">说明:双击列表框的一个选项,就将该文件夹下面的文件夹显示在该列表框中。第一个就是根目录</font>
  29. </td>
  30. </tr>
  31. </table>
  32. </body>
  33. </html>
  34. <script>
  35. /**//*
  36. *初始化,将系统所有的驱动器放入table_drives列表
  37. */
  38. window.onload=newfunctioninit()
  39. {
  40. varfso,s,n,e,x;
  41. fso=newActiveXObject("Scripting.FileSystemObject");
  42. e=newEnumerator(fso.Drives);
  43. s="";
  44. for(;!e.atEnd();e.moveNext())
  45. {
  46. x=e.item();
  47. s=s+x.DriveLetter;
  48. s+=":";
  49. if(x.DriveType==3)
  50. n=x.ShareName;
  51. elseif(x.IsReady)
  52. n=x.VolumeName;
  53. else
  54. n="[驱动器未就绪]";
  55. s+=n+",";
  56. }
  57. vardrives=s.split(",");
  58. vartableDrives=document.getElementById("tables_drives");
  59. for(vari=0;i<drives.length-1;i++)
  60. {
  61. varoption=document.createElement("OPTION");
  62. drives[i].split(":");
  63. option.value="["+drives[i].split(":")[0]+":]"+drives[i].split(":")[1];
  64. option.text="["+drives[i].split(":")[0]+":]"+drives[i].split(":")[1];
  65. tableDrives.add(option);
  66. }
  67. }
  68. /**//*
  69. *tables_drives列表中选中的驱动器上所有文件夹放入table_folder列表中
  70. */
  71. functionget_drives()
  72. {
  73. vartableDrives=document.getElementById("tables_drives");
  74. vartableFolders=document.getElementById("table_folder");
  75. for(vari=0;i<tableDrives.options.length;i++)
  76. {
  77. if(tableDrives.options[i].selected==true)
  78. {
  79. varfso,f,fc,s;
  80. vardrive=tableDrives.options[i].value.split(":")[0].substring(1,tableDrives.options[i].value.split(":")[0].length);
  81. document.getElementById("backDir").value=drive+":\\";
  82. fso=newActiveXObject("Scripting.FileSystemObject");
  83. if(fso.DriveExists(drive))
  84. {
  85. d=fso.GetDrive(drive);
  86. if(d.IsReady)
  87. {
  88. f=fso.GetFolder(d.RootFolder);
  89. fc=newEnumerator(f.SubFolders);
  90. s="";
  91. for(;!fc.atEnd();fc.moveNext())
  92. {
  93. s+=fc.item();
  94. s+=",";
  95. }
  96. varlen=tableFolders.options.length;
  97. while(len>=0)
  98. {
  99. tableFolders.options.remove(len);
  100. len--;
  101. }
  102. varoption=document.createElement("OPTION");
  103. option.value=drive+":\\";
  104. option.text=drive+":\\";
  105. tableFolders.add(option);
  106. varfolders=s.split(",");
  107. for(j=0;j<folders.length-1;j++)
  108. {
  109. option=document.createElement("OPTION");
  110. option.value=folders[j];
  111. option.text=folders[j];
  112. tableFolders.add(option);
  113. }
  114. }
  115. else
  116. {
  117. alert("无法改变当前内容!")
  118. }
  119. }
  120. else
  121. returnfalse;
  122. }
  123. }
  124. }
  125. /**//*
  126. *table_folder双击选项中的一个选项,就将该文件夹下面的文件夹显示在table_folder列表中。
  127. */
  128. functionget_file()
  129. {
  130. vartableFolders=document.getElementById("table_folder");
  131. vartableDrives=document.getElementById("tables_drives");
  132. for(vari=0;i<tableFolders.options.length;i++)
  133. {
  134. if(tableFolders.options[i].selected==true)
  135. {
  136. varfso,f,fc,s;
  137. varfolderpath=tableFolders.options[i].value.substring(0,tableFolders.options[i].value.length);
  138. if(folderpath.charAt(folderpath.length-1)=="\\")
  139. {
  140. document.getElementById("backDir").value=folderpath;
  141. }
  142. else
  143. {
  144. document.getElementById("backDir").value=folderpath+"\\";
  145. }
  146. fso=newActiveXObject("Scripting.FileSystemObject");
  147. f=fso.GetFolder(folderpath);
  148. fc=newEnumerator(f.SubFolders);
  149. s="";
  150. for(;!fc.atEnd();fc.moveNext())
  151. {
  152. s+=fc.item();
  153. s+=",";
  154. }
  155. varlen=tableFolders.options.length;
  156. while(len>=0)
  157. {
  158. tableFolders.options.remove(len);
  159. len--;
  160. }
  161. varopt="";
  162. varopt1="";
  163. for(j=0;j<folderpath.split("\\").length;j++)
  164. {
  165. varoption=document.createElement("OPTION");
  166. opt=opt+folderpath.split("\\")[j]+"\\";
  167. if(j>0)
  168. {
  169. opt1=opt;
  170. option.value=opt1.substring(0,opt1.length-1);
  171. option.text=opt1.substring(0,opt1.length-1);
  172. tableFolders.add(option);
  173. }
  174. else
  175. {
  176. option.value=opt;
  177. option.text=opt;
  178. tableFolders.add(option);
  179. }
  180. }
  181. if(tableFolders.options[0].value==tableFolders.options[1].value)
  182. {
  183. tableFolders.options.remove(1);
  184. }
  185. if(s!="")
  186. {
  187. varfolders=s.split(",");
  188. for(j=0;j<folders.length-1;j++)
  189. {
  190. option=document.createElement("OPTION");
  191. option.value=folders[j];
  192. option.text=folders[j];
  193. tableFolders.add(option);
  194. }
  195. }
  196. }
  197. }
  198. }
  199. </script>

你可能感兴趣的:(JavaScript)