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 相关文章推荐
通过jQuery源码学习javascript(三)
Dec 27 Javascript
JavaScript和CSS通过expression实现Table居中显示
Jun 28 Javascript
JavaScript中的ubound函数使用实例
Nov 04 Javascript
JS实现简单的二维矩阵乘积运算
Jan 26 Javascript
如何用JS/HTML将时间戳转换为“xx天前”的形式
Feb 06 Javascript
使用JS 插件qrcode.js生成二维码功能
Feb 20 Javascript
详解如何使用webpack打包Vue工程
May 27 Javascript
利用types增强vscode中js代码提示功能详解
Jul 07 Javascript
浅谈react+es6+webpack的基础配置
Aug 09 Javascript
js实现按钮开关单机下拉菜单效果
Nov 22 Javascript
JavaScript继承的特性与实践应用深入详解
Dec 30 Javascript
vue使用lodop打印控件实现浏览器兼容打印的方法
Feb 07 Vue.js
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的栏目导航程序
2006/10/09 PHP
thinkphp自定义权限管理之名称判断方法
2017/04/01 PHP
Laravel-添加后台模板AdminLte的实现方法
2019/10/08 PHP
php如何获取Http请求
2020/04/30 PHP
js技巧--转义符&quot;\&quot;的妙用
2007/01/09 Javascript
JavaScript下申明对象的几种方法小结
2008/10/02 Javascript
一个可绑定数据源的jQuery数据表格插件
2010/07/17 Javascript
jquery设置元素的readonly和disabled的写法
2013/09/22 Javascript
zTree插件之多选下拉菜单实例代码
2013/11/06 Javascript
js处理表格对table进行修饰
2014/05/26 Javascript
jQuery中removeProp()方法用法实例
2015/01/05 Javascript
jquery的幻灯片图片切换效果代码分享
2015/09/07 Javascript
微信小程序 解决swiper不显示图片的方法
2017/01/04 Javascript
基于React实现表单数据的添加和删除详解
2017/03/14 Javascript
js实现按座位号抽奖
2017/04/05 Javascript
详解webpack进阶之插件篇
2017/07/06 Javascript
基于jQuery的左滑出现删除按钮的示例
2017/08/29 jQuery
微信小程序 扭蛋抽奖机css3动画实现详解
2019/07/19 Javascript
基于Vue CSR的微前端实现方案实践
2020/05/27 Javascript
python访问sqlserver示例
2014/02/10 Python
Python中的lstrip()方法使用简介
2015/05/19 Python
MySQL中表的复制以及大型数据表的备份教程
2015/11/25 Python
Python2.7下安装Scrapy框架步骤教程
2017/12/22 Python
python全局变量引用与修改过程解析
2020/01/07 Python
python构造函数init实例方法解析
2020/01/19 Python
对tensorflow 中tile函数的使用详解
2020/02/07 Python
Django高并发负载均衡实现原理详解
2020/04/04 Python
解决pycharm导入numpy包的和使用时报错:RuntimeError: The current Numpy installation (‘D:\\python3.6\\lib\\site-packa的问题
2020/12/08 Python
html5 初试 indexedDB(推荐)
2016/07/21 HTML / CSS
英超联赛的首选足球:Mitre足球
2019/05/06 全球购物
自我评价怎么写好呢?
2013/12/05 职场文书
教师党的群众路线对照检查材料
2014/09/24 职场文书
2014年预备党员群众路线教育实践活动对照检查材料思想汇报
2014/10/02 职场文书
组织生活会发言材料
2014/12/15 职场文书
幼儿园见习总结
2015/06/23 职场文书
Redis实战之Lettuce的使用技巧详解
2022/12/24 Redis