JS+ACTIVEX实现网页选择本地目录路径对话框


Posted in Javascript onMarch 18, 2013

网页选择本地目录路径对话框,使用ACTIVEX对象遍历本地磁盘和目录,只需网页启用相关ACTIVEX的INTERNET选项,对本地浏览器的安全性要求不高,简单易用。

网页选择本地目录路径对话框样例

1.打开主页面"select.html",点击“选择路径”按钮进入路径选择页面“dir.html”,选取本地目录路径

JS+ACTIVEX实现网页选择本地目录路径对话框

2.路径选择页面“dir.html”初始化后,加载本地磁盘驱动,然后根据选择的磁盘路径加载其中的目录。如目录中存在子目录,双击该目录列表项进入下一集目录。

JS+ACTIVEX实现网页选择本地目录路径对话框

3.点击“确定”,关闭选择路径页面"dir.html",将选择的路径值返回到主页面"select.html"文本框上

JS+ACTIVEX实现网页选择本地目录路径对话框

/**//* 
*初始化,将系统所有的驱动器放入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 == 3) 
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 = 0; i < drives.length-1; i++ ) 
{ 
var option = document.createElement("OPTION"); 
drives[i].split(":"); 
option.value = "["+drives[i].split(":")[0]+":]"+drives[i].split(":")[1]; 
option.text = "["+drives[i].split(":")[0]+":]"+drives[i].split(":")[1]; 
tableDrives.add(option); 
} 
get_drives(); 
} /**//* 
*tables_drives列表中选中的驱动器上所有文件夹放入table_folder列表中 
*/ 
function get_drives() 
{ 
var tableDrives = document.getElementById("tables_drives"); 
var tableFolders = document.getElementById("table_folder"); 
for ( var i = 0; i < tableDrives.options.length; i++ ) 
{ 
if ( tableDrives.options[i].selected == true ) 
{ 
var fso, f, fc, s; 
var drive = tableDrives.options[i].value.split(":")[0].substring(1,tableDrives.options[i].value.split(":")[0].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 >= 0) 
{ 
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 = 0; j < folders.length -1; j++) 
{ 
option = document.createElement("OPTION"); 
option.value = folders[j]; 
option.text = folders[j]; 
tableFolders.add(option); 
} 
} 
else 
{ 
alert("无法改变当前内容!") 
} 
} 
else 
return false; 
} 
} 
} 
function get_fileName() 
{ 
var tableFolders = document.getElementById("table_folder"); 
for ( var i = 0; i < tableFolders.options.length; i++ ) 
{ 
if ( tableFolders.options[i].selected == true ) 
{ 
var folderpath = tableFolders.options[i].value.substring(0,tableFolders.options[i].value.length); 
if ( folderpath.charAt(folderpath.length-1) == "\\" ) 
{ 
document.getElementById("backDir").value = folderpath; 
} 
else 
{ 
document.getElementById("backDir").value = folderpath + "\\"; 
} 
} 
} 
} 
/**//* 
*table_folder双击选项中的一个选项,就将该文件夹下面的文件夹显示在table_folder列表中。 
*/ 
function get_file() 
{ 
var tableFolders = document.getElementById("table_folder"); 
var tableDrives = document.getElementById("tables_drives"); 
for ( var i = 0; i < tableFolders.options.length; i++ ) 
{ 
if ( tableFolders.options[i].selected == true ) 
{ 
var fso, f, fc, s; 
var folderpath = tableFolders.options[i].value.substring(0,tableFolders.options[i].value.length); 
if ( folderpath.charAt(folderpath.length-1) == "\\" ) 
{ 
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 >= 0) 
{ 
tableFolders.options.remove(len); 
len--; 
} 
var opt = ""; 
var opt1 = ""; 
for ( j = 0; j < folderpath.split("\\").length; j++ ) 
{ 
var option = document.createElement("OPTION"); 
opt = opt + folderpath.split("\\")[j]+"\\"; 
if ( j > 0) 
{ 
opt1 = opt; 
option.value = opt1.substring(0,opt1.length-1); 
option.text = opt1.substring(0,opt1.length-1); 
tableFolders.add(option); 
} 
else 
{ 
option.value = opt; 
option.text = opt; 
tableFolders.add(option); 
} 
} 
if ( tableFolders.options[0].value == tableFolders.options[1].value ) 
{ 
tableFolders.options.remove(1); 
} 
if ( s != "" ) 
{ 
var folders = s.split(","); 
for ( j = 0; j < folders.length -1; j++) 
{ 
option = document.createElement("OPTION"); 
option.value = folders[j]; 
option.text = folders[j]; 
tableFolders.add(option); 
} 
} 
} 
} 
}
Javascript 相关文章推荐
关于取不到由location.href提交而来的上级页面地址的解决办法
Jul 30 Javascript
js 键盘记录实现(兼容FireFox和IE)
Feb 07 Javascript
制作高质量的JQuery Plugin 插件的方法
Apr 20 Javascript
IE6中使用position导致页面变形的解决方案(js代码)
Jan 09 Javascript
解决js下referer兼容各大浏览器的方法
Nov 03 Javascript
node.js中的fs.renameSync方法使用说明
Dec 16 Javascript
BootStrap制作导航条实例代码
May 06 Javascript
jQuery中show与hide方法用法示例
Sep 16 Javascript
浅谈JS如何实现真正的对象常量
Jun 25 Javascript
基于JavaScript实现抽奖系统
Jan 16 Javascript
浅谈vuex的基本用法和mapaction传值问题
Nov 08 Javascript
react中props 的使用及进行限制的方法
Apr 28 Javascript
jQuery Mobile页面跳转后未加载外部JS原因分析及解决
Mar 18 #Javascript
jquery.blockUI.js上传滚动等待效果实现思路及代码
Mar 18 #Javascript
jQuery用unbind方法去掉hover事件及其他方法介绍
Mar 18 #Javascript
JQuery的read函数与js的onload不同方式实现
Mar 18 #Javascript
js前台分页显示后端JAVA数据响应
Mar 18 #Javascript
侧栏跟随滚动的简单实现代码
Mar 18 #Javascript
JS特权方法定义作用以及与公有方法的区别
Mar 18 #Javascript
You might like
PHP几个数学计算的内部函数学习整理
2011/08/06 PHP
php遍历树的常用方法汇总
2015/06/18 PHP
mysql_escape_string()函数用法分析
2016/04/25 PHP
php适配器模式简单应用示例
2019/10/23 PHP
深入理解Javascript中的循环优化
2013/11/09 Javascript
对于Form表单reset方法的新认识
2014/03/05 Javascript
js冒泡、捕获事件及阻止冒泡方法详细总结
2014/05/08 Javascript
javascript动态控制服务器控件实例
2014/09/05 Javascript
jQuery中extend函数详解
2015/07/13 Javascript
浅谈js中子页面父页面方法 变量相互调用
2016/08/04 Javascript
js实现移动端导航点击自动滑动效果
2017/07/18 Javascript
Angular2 组件间通过@Input @Output通讯示例
2017/08/24 Javascript
vue 点击按钮实现动态挂载子组件的方法
2018/09/07 Javascript
vue debug 二种方法
2018/09/16 Javascript
详解Angular cli配置过程记录
2019/11/07 Javascript
vue 项目引入echarts 添加点击事件操作
2020/09/09 Javascript
[01:13:08]2018DOTA2亚洲邀请赛4.6 淘汰赛 mineski vs LGD 第二场
2018/04/10 DOTA
[11:12]2018DOTA2国际邀请赛寻真——绿色长城OpTic
2018/08/10 DOTA
Python绑定方法与非绑定方法详解
2017/08/18 Python
Python使用arrow库优雅地处理时间数据详解
2017/10/10 Python
解决python3 网络请求路径包含中文的问题
2018/05/10 Python
对Python中plt的画图函数详解
2018/11/07 Python
python/sympy求解矩阵方程的方法
2018/11/08 Python
pytorch 利用lstm做mnist手写数字识别分类的实例
2020/01/10 Python
Python Tensor FLow简单使用方法实例详解
2020/01/14 Python
Python selenium文件上传下载功能代码实例
2020/04/13 Python
用python给csv里的数据排序的具体代码
2020/07/17 Python
使用python批量修改XML文件中图像的depth值
2020/07/22 Python
加拿大时尚少女服装品牌:Garage
2016/10/10 全球购物
应届生文秘专业个人自荐信格式
2013/09/21 职场文书
新学期决心书
2014/03/11 职场文书
敲诈同学钱财检讨书范文
2014/11/18 职场文书
2015年六一儿童节活动总结
2015/02/11 职场文书
运动会通讯稿100字
2015/07/20 职场文书
NodeJs使用webpack打包项目的方法详解
2022/02/28 NodeJs
Python测试框架pytest高阶用法全面详解
2022/06/01 Python