javascript文件夹选择框的两种解决方案

解决方案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控件进行初始化和脚本运行"----"启用"

/**//***
path 要显示值的对象id
****/
function browseFolder(path) {
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(path).value = Folder;
return Folder;
}
}
catch (e) {
alert(e.message);
}
}

browseFolder.js:

<input type="button" onclick="browseFolder('path')" value="选择生成路径" />
显示选择的目录地址:<input type="text" name="path" />

test.aspx

效果图:

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

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
<table border="" cellpadding="" width="100%" id="tb_show">
<tr>
<td width="18%">文件保存位置:</td>
<td width="82%">
<%--<html:file property="file" size="" styleClass="inputbox"/>--%>
<input name="backDir" type="text" value ="C:\" size="" width="">
</td>
</tr> <tr>
<td>目录位置:</td>
<td>
<select name="tables_drive" id="tables_drives" onchange="get_drives()" ></select>
</td>
</tr> <tr>
<td colspan="">
<select name="table_folder" id="table_folder" size="" multiple ondblclick="get_file()"></select>
</td>
</tr> <tr>
<td colspan="">
<font color="red">说明:双击列表框的一个选项,就将该文件夹下面的文件夹显示在该列表框中。第一个就是根目录</font>
</td>
</tr>
</table>
</body>
</html>

test.aspx

<script  type="text/javascript">
/**//*
*初始化,将系统所有的驱动器放入table_drives列表
*/
window.onload = new function init()
{
var fso, s, n, e, x;
fso = new ActiveXObject("Scripting.FileSystemObject");
e = new Enumerator(fso.Drives);
s = "";
for (; !e.atEnd(); e.moveNext())
{
x = e.item();
s = s + x.DriveLetter;
s += ":";
if (x.DriveType == )
n = x.ShareName;
else if (x.IsReady)
n = x.VolumeName;
else
n = "[驱动器未就绪]";
s += n + ",";
}
var drives = s.split(",");
var tableDrives = document.getElementById("tables_drives");
for ( var i = ; i < drives.length-; i++ )
{
var option = document.createElement("OPTION");
drives[i].split(":");
option.value = "["+drives[i].split(":")[]+":]"+drives[i].split(":")[];
option.text = "["+drives[i].split(":")[]+":]"+drives[i].split(":")[];
tableDrives.add(option);
}
} /**//*
*tables_drives列表中选中的驱动器上所有文件夹放入table_folder列表中
*/
function get_drives()
{
var tableDrives = document.getElementById("tables_drives");
var tableFolders = document.getElementById("table_folder");
for ( var i = ; i < tableDrives.options.length; i++ )
{
if ( tableDrives.options[i].selected == true )
{
var fso, f, fc, s;
var drive = tableDrives.options[i].value.split(":")[].substring(,tableDrives.options[i].value.split(":")[].length);
document.getElementById("backDir").value = drive + ":\\";
fso = new ActiveXObject("Scripting.FileSystemObject");
if (fso.DriveExists(drive))
{
d = fso.GetDrive(drive);
if ( d.IsReady )
{
f = fso.GetFolder(d.RootFolder);
fc = new Enumerator(f.SubFolders);
s = "";
for (;!fc.atEnd(); fc.moveNext())
{
s += fc.item();
s += ",";
} var len = tableFolders.options.length;
while(len >= )
{
tableFolders.options.remove(len);
len--;
}
var option = document.createElement("OPTION");
option.value = drive + ":\\";
option.text = drive + ":\\";
tableFolders.add(option);
var folders = s.split(",");
for ( j = ; j < folders.length -; j++)
{
option = document.createElement("OPTION");
option.value = folders[j];
option.text = folders[j];
tableFolders.add(option);
}
}
else
{
alert("无法改变当前内容!")
}
}
else
return false;
}
}
} /**//*
*table_folder双击选项中的一个选项,就将该文件夹下面的文件夹显示在table_folder列表中。
*/
function get_file()
{
var tableFolders = document.getElementById("table_folder");
var tableDrives = document.getElementById("tables_drives");
for ( var i = ; i < tableFolders.options.length; i++ )
{
if ( tableFolders.options[i].selected == true )
{
var fso, f, fc, s;
var folderpath = tableFolders.options[i].value.substring(,tableFolders.options[i].value.length);
if ( folderpath.charAt(folderpath.length-) == "\\" )
{
document.getElementById("backDir").value = folderpath;
}
else
{
document.getElementById("backDir").value = folderpath + "\\";
} fso = new ActiveXObject("Scripting.FileSystemObject");
f = fso.GetFolder(folderpath);
fc = new Enumerator(f.SubFolders);
s = "";
for (;!fc.atEnd(); fc.moveNext())
{
s += fc.item();
s += ",";
}
var len = tableFolders.options.length;
while(len >= )
{
tableFolders.options.remove(len);
len--;
}
var opt = "";
var opt1 = "";
for ( j = ; j < folderpath.split("\\").length; j++ )
{
var option = document.createElement("OPTION");
opt = opt + folderpath.split("\\")[j]+"\\";
if ( j > )
{
opt1 = opt;
option.value = opt1.substring(,opt1.length-);
option.text = opt1.substring(,opt1.length-);
tableFolders.add(option);
}
else
{
option.value = opt;
option.text = opt;
tableFolders.add(option);
} }
if ( tableFolders.options[].value == tableFolders.options[].value )
{
tableFolders.options.remove();
}
if ( s != "" )
{
var folders = s.split(",");
for ( j = ; j < folders.length -; j++)
{
option = document.createElement("OPTION");
option.value = folders[j];
option.text = folders[j];
tableFolders.add(option);
}
}
}
}
}
</script>

js

效果图:

javascript文件夹选择框的两种解决方案的更多相关文章

  1. Asp.net点击按钮弹出文件夹选择框的实现(网页)

    本文地址:http://www.cnblogs.com/PiaoMiaoGongZi/p/4092112.html 在Asp.net网站实际的开发中,比如:需要实现点击一个类似于FileUpload的 ...

  2. MFC 打开文件夹选择框并获取文件夹路径

    CString FicowGetDirectory() { BROWSEINFO bi; char name[MAX_PATH]; ZeroMemory(&bi, sizeof(BROWSEI ...

  3. 文件批量上传-统一附件管理器-在线预览文件(有互联网和没有两种)--SNF快速开发平台3.0

    实际上在SNF里使用附件管理是非常简单的事情,一句代码就可以搞定.但我也要在这里记录一下统一附件管理器能满足的需求. 通用的附件管理,不要重复开发,调用尽量简洁. 批量文件上传,并对每个文件大小限制, ...

  4. 导模块的细节:(跨文件导入模块 &模块的两种执行方式) | 包的概念与使用 | 包中的相对导入语法

    今日内容 包: 1. 导入模块的细节 2. 包的概念与使用 3. 包中的相对导入语法 跨文件夹导入模块 1. 假设有一个文件夹a ,a 的下面有一个ma 的模块,如果a文件夹所在目录在环境变量,a文件 ...

  5. [VB.NET]调用系统的文件夹选择对话框

    以下示例代码展示如何调用系统的文件夹选择对话框: Private Function SelectFolder(ByVal Describe As String, Optional ByVal Show ...

  6. Java学习-014-文本文件写入实例源代码(两种写入方式)

    此文源码主要为应用 Java 读取文本文件内容实例的源代码.若有不足之处,敬请大神指正,不胜感激! 第一种:文本文件写入,若文件存在则删除原文件,并重新创建文件.源代码如下所示: /** * @fun ...

  7. Java学习-013-文本文件读取实例源代码(两种数据返回格式)

    此文源码主要为应用 Java 读取文本文件内容实例的源代码.若有不足之处,敬请大神指正,不胜感激! 1.读取的文本文件内容以一维数组[LinkedList<String>]的形式返回,源代 ...

  8. c# 打开、保存文件对话框 和 文件夹选择对话框

    1. OpenFileDialog openImageDialog = new OpenFileDialog(); openImageDialog.Filter = "Image Files ...

  9. web.config文件中配置数据库连接的两种方式

    web.config文件中配置数据库连接的两种方式 标签: 数据库webconfig 2015-04-28 18:18 31590人阅读 评论(1)收藏举报    分类: 数据库(74)  在网站开发 ...

随机推荐

  1. Java程序员的日常 —— 工作一天的收获

    看题目可能是扯皮,其实还是有很多专业知识的.从最开始没有注意到设计原则,到后面的jquery实战技巧,都是今天一天碰到的问题. 每天整理一点点,每天收获一点点. 关于软件设计 在设计系统结构的时候,一 ...

  2. 统计项目的java代码总行数

    http://www.oschina.net/code/snippet_209431_7358 wc -l $(find . -type f -name '*.java')

  3. NR_OPEN 与 NR_FILE 的区别

    NR_OPEN 与 NR_FILE 的区别 阅读0.11版的内核源码时,在linux-0.11/fs/pipe.c中,函数sys_pipe()里面出现了2个宏定义,NR_OPEN 与 NR_FILE. ...

  4. ssh sftp scp命令

    scp local_file remote_username@remote_ip:remote_folder 或者 scp local_file remote_username@remote_ip:r ...

  5. ios app 提交评审注意事项

    在网络上看到的一个文档是这样写,原文的出处无法确认了 基本要点 ·         不能导致手机故障(比如崩溃或屏幕问题) ·         长时间/过度使用之后反应仍然很快 ·         应 ...

  6. 利用Mysql提供的字符串方法查找字符串中某字符出现的次数

    有这么一个需求,查出分类中没有子分类的一级分类,脑海中首次出现的解决思路和这样的 先使用PHP查出所有的一级分类 递归查询一级分类是否有子分类 将没有子分类的一级分类汇总 但觉的这样处理太麻烦了,然后 ...

  7. 深入剖析 redis AOF 持久化策略

    本篇主要讲的是 AOF 持久化,了解 AOF 的数据组织方式和运作机制.redis 主要在 aof.c 中实现 AOF 的操作. 数据结构 rio redis AOF 持久化同样借助了 struct ...

  8. ECShop商品详细页 实现尺码颜色关联显示库存数量

    效果如下: 要开模板文件 goods.dwt  把选择尺码跟颜色的代码替换成如下,(不同模板代码可能不一样,对照去替换) <!-- {foreach from=$spec.values item ...

  9. JRE_HOME environment variable is not defined correctly This environment variableis needed to run this program

    已经安装了JDK1.7 和对应JRE 安装了tomcat8 都是解压版 并设置了JAVA_HOME.JRE_HOME 但Tomcat在启动过程中找不到 错误: the JRE_HOME environ ...

  10. C#代理那点事儿

    Func代理是啥? Func代理接收0个或多个参数,返回TResult值: 以Func<TSource, TResult>为例:Func带来封装一个方法,该方法接收一个参数,然会一个TRe ...