javascript 选择文件夹对话框(web)


Posted in Javascript onJuly 07, 2009

没有办法,实践证明最好的解决办法是自己写一个OCX控件,这样就只要注册一下OCX控件就可以了,同时OCX控件的可扩展性非常大,也就是给vc\delphi这些程序的功能引入到web中,其功能可想而知!
这里不说明OCX开发的过程了,给自己写的OCX控件共享一下,希望能给一些朋友提供帮助。
这个OCX控件中提供了一个getFiles()方法,只要获取控件对象,然后调用getFiles()方法就可以获取对应路径下的所有文件,如下图:
javascript 选择文件夹对话框(web)
该控件可以选择任意盘符下的任意文件夹,图中最下面的按钮时web中的input,通过web中的js方法来获取文件列表,OCX
的getFiles()方法返回文件名串,样式如1.jpg;2.jpg;3.jpg,每个文件名中间用“;”链接,在js中使用split方法来分离一下就可以了。
页面代码如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>无标题文档</title> 
<script type="text/javascript"><!-- 
function show(){ 
var obj=document.getElementById("pathOcx"); 
var str=obj.getFiles(); 
var list=str.split(";"); 
for(var i=0;i<list.length;i++){ 
if(list[i]!=""){ 
alert(list[i]); 
    } 
} 
} 
// --></script> 
</head> <body> 
<OBJECT 
id="pathOcx" 
     classid="clsid:13BF0862-063C-432F-A8DF-07C2823E8562" 
     width=420 
     height=300 
     align=center 
     hspace=0 
     vspace=0 
> 
</OBJECT> 
<br> 
<input type="button" name="Submit" value="显示数据" onClick="show()"> 
</body> 
</html>

这样就可以使用该控件选取任意文件夹了,并且可以通过js获取文件夹中的所有内容,由于篇幅有限,这里不对该OCX更多的功能做说明,下篇准备给OCX增加上传功能,这样既可以上传整个文件夹,而且支持断点续传。

最后注明:OCX使用的时候需要注册控件

注册方法:运行cmd,进入比如OCX控件在C:\123.OCX,在cmd中运行RegSvr32   c:\123.OCX,会提示注册成功,然后就可以在网页中使用了!
打包下载

Javascript 相关文章推荐
通用javascript脚本函数库 方便开发
Oct 13 Javascript
在UpdatePanel内jquery easyui效果失效的解决方法
Apr 11 Javascript
JS JSON对象转为字符串的简单实现方法
Nov 18 Javascript
用JavaScript实现一个代码简洁、逻辑不复杂的多级树
May 23 Javascript
node.js中的querystring.stringify方法使用说明
Dec 10 Javascript
js实现iPhone界面风格的单选框和复选框按钮实例
Aug 18 Javascript
EasyUI闪屏EasyUI页面加载提示(原理+代码+效果图)
Feb 21 Javascript
Bootstrap导航条可点击和鼠标悬停显示下拉菜单的实现代码
Jun 23 Javascript
解决vue中使用swiper插件问题及swiper在vue中的用法
Apr 04 Javascript
element vue Array数组和Map对象的添加与删除操作
Nov 14 Javascript
Vue组件间通信方法总结(父子组件、兄弟组件及祖先后代组件间)
Apr 17 Javascript
微信小程序日历弹窗选择器代码实例
May 09 Javascript
JavaScript 解析读取XML文档 实例代码
Jul 07 #Javascript
javascript 新浪背投广告实现代码
Jul 07 #Javascript
JavaScript 对象、函数和继承
Jul 07 #Javascript
js 日期转换成中文格式的函数
Jul 07 #Javascript
javascript 面向对象思想 附源码
Jul 07 #Javascript
jquery BS,dialog控件自适应大小
Jul 06 #Javascript
javascript 浏览器判断 绑定事件 arguments 转换数组 数组遍历
Jul 06 #Javascript
You might like
php魔法函数与魔法常量使用介绍
2017/07/23 PHP
JS setCapture 区域外事件捕捉
2010/03/18 Javascript
JS对象转换为Jquery对象示例
2014/01/26 Javascript
Jquery对数组的操作技巧整理
2014/03/25 Javascript
nodejs批量修改文件编码格式
2015/01/22 NodeJs
JS实现在状态栏显示打字效果完整实例
2015/11/02 Javascript
JavaScript代码性能优化总结篇
2016/05/15 Javascript
js 实现一些跨浏览器的事件方法详解及实例
2016/10/27 Javascript
Nodejs基于LRU算法实现的缓存处理操作示例
2017/03/17 NodeJs
基于JavaScript实现报警器提示音效果
2017/10/27 Javascript
详解Vue 事件修饰符capture 的使用
2017/12/29 Javascript
JS中验证整数和小数的正则表达式
2018/10/08 Javascript
AngularJS 监听变量变化的实现方法
2018/10/09 Javascript
仿vue-cli搭建属于自己的脚手架的方法步骤
2019/04/17 Javascript
微信小程序实现张图片合成为一张并下载
2019/07/16 Javascript
JS数组方法shift()、unshift()用法实例分析
2020/01/18 Javascript
jquery实现简单拖拽效果
2020/07/20 jQuery
Nest.js环境变量配置与序列化详解
2021/02/21 Javascript
详解python中的json的基本使用方法
2016/12/21 Python
python之PyMongo使用总结
2017/05/26 Python
Python通过属性手段实现只允许调用一次的示例讲解
2018/04/21 Python
python复制列表时[:]和[::]之间有什么区别
2018/10/16 Python
python实现密码验证合格程序的思路详解
2020/06/01 Python
基于 HTML5 Canvas实现 的交互式地铁线路图
2018/03/05 HTML / CSS
加拿大当代时尚服饰、配饰和鞋类专业零售商和制造商:LE CHÂTEAU
2017/10/06 全球购物
德国内衣、泳装和睡衣网上商店:Bigsize Dessous
2018/07/09 全球购物
运动鞋、足球鞋和慕尼黑球衣:Sport Münzinger
2019/08/26 全球购物
数控技术应届生求职信
2013/11/13 职场文书
跟单文员岗位职责
2014/01/03 职场文书
新品发布会策划方案
2014/06/08 职场文书
四风问题个人自查剖析材料思想汇报
2014/09/21 职场文书
幼儿园小班工作总结2015
2015/04/25 职场文书
大学军训通讯稿
2015/07/18 职场文书
公司车队管理制度
2015/08/04 职场文书
vite+vue3.0+ts+element-plus快速搭建项目的实现
2021/06/24 Vue.js
我家女友可不止可爱呢 公开OP主题曲无字幕动画MV
2022/04/11 日漫