使用JS进行目录上传(相当于批量上传)


Posted in Javascript onDecember 05, 2010
<!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=gb2312" /> 
<title>测试文件上传</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script language="javascript" type="text/javascript"> 
$(function(){ 
//ShowFolderFileList("D:\\CodeNet\\web\\Images\\shopTemplets"); 
}); 
function ShowFolderFileList(FilePath){ 
var fso, f, fc, sf; 
fso = new ActiveXObject("Scripting.FileSystemObject"); 
try{ 
f = fso.GetFolder(FilePath); 
}catch(err){ 
alert("文件路径错误或者不存在!!"); 
return false; 
} 
// 列出所有文件 
fc = new Enumerator(f.files); 
var fileName = ""; 
for(;!fc.atEnd();fc.moveNext()){ 
fileName=fc.item().Name; 
$('<div filePath="' + FilePath + fileName + '" uploadState="wait">' + FilePath + fileName + '</div>').appendTo('#showArea'); 
} 
// 循环 递归 读取 文件夹的文件 
sf = new Enumerator(f.SubFolders); 
var folderName = ""; 
for(;!sf.atEnd();sf.moveNext()){ 
folderName = sf.item().Name; 
ShowFolderFileList(FilePath + folderName + "/"); 
} 
} 
function startUpload(){ 
var s = $('#uploaddir').val().replace( /\\/gi, '/' ) ; 
if(s.substring(s.length - 1 , s.length) != '/'){ 
s += '/' 
} 
ShowFolderFileList(s) 
uploadFile(); 
} 
// 上传 
function uploadFile(){ 
if($('#showArea div[uploadState=wait]').length > 0){ 
var thisNode = $('#showArea div[uploadState=wait]').eq(0) 
var WshShell=new ActiveXObject("WScript.Shell"); 
$('#fileupload').focus(); 
WshShell.SendKeys($(thisNode).attr('filePath')); // 路径中不有是中文 
uploadForm.submit(); 
$('#fileupload').focus(); 
$('#fileupload').get(0).createTextRange().select(); 
WshShell.SendKeys('{del}'); 
var dotStr = '.'; 
$('<span></span>').appendTo(thisNode).css('color', 'green'); 
var uploadState = setInterval(function(){ 
if($(thisNode).attr('uploadState') == 'ok'){ 
clearInterval(uploadState); 
$(thisNode).find('span').css('color', 'red').text('(完成)'); 
uploadFile(); 
}else{ 
if(dotStr.length > 15){ dotStr = '.'; }else{ dotStr += '.'; } 
$(thisNode).find('span').text('(上传中' + dotStr + ')'); 
} 
}, 1000); 
} 
} 
// 在iframe 的返回页面中调用此函数 即可实现循环上传,,否则为死循环 
function uploadFinish(){ 
$('#showArea div[uploadState=wait]').eq(0).attr('uploadState', 'ok'); 
} 
</script> 
<style type="text/css"> 
body,td,th { 
font-family: "微软雅黑", Tahoma, Helvetica, Arial, \5b8b\4f53, sans-serif; 
} 
</style> 
</head> 
<body> 
<form action="/a.html" method="post" name="loginForm" style="margin:0 0; padding:0 0;"> 
<input name="uploaddir" id="uploaddir" type="text" value="D:\a" style="width:800px;" /> 
<input type="button" value="开始" id="startIt" name="startIt" onclick="javascript:startUpload();"/> 
</form> 
<form action="/index/upload" method="post" name="uploadForm" enctype="multipart/form-data" target="hidden_frame"> 
<input type="file" name="fileupload" id="fileupload" /> 
<iframe name='hidden_frame' id="hidden_frame" style='display:none'></iframe> 
</form> 
</iframe> 
<div id="showArea"> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
ExtJS 学习专题(一) 如何应用ExtJS(附实例)
Mar 11 Javascript
javascript 伪数组实现方法
Oct 11 Javascript
Textarea根据内容自适应高度
Oct 28 Javascript
Jquery实现由下向上展开效果的例子
Dec 08 Javascript
node.js中的dns.getServers方法使用说明
Dec 08 Javascript
JS正则表达式比较常见用法
Jan 26 Javascript
JavaScript的模块化开发框架Sea.js上手指南
May 12 Javascript
基于JS如何实现类似QQ好友头像hover时显示资料卡的效果(推荐)
Jun 09 Javascript
angularjs实现首页轮播图效果
Apr 14 Javascript
JavaScript插件Tab选项卡效果
Nov 14 Javascript
Javascript生成器(Generator)的介绍与使用
Jan 31 Javascript
vue 使用 v-model 双向绑定父子组件的值遇见的问题及解决方案
Mar 01 Vue.js
js对象的构造和继承实现代码
Dec 05 #Javascript
收集的一些Array及String原型对象的扩展实现代码
Dec 05 #Javascript
script标签的 charset 属性使用说明
Dec 04 #Javascript
本地对象Array的原型扩展实现代码
Dec 04 #Javascript
悄悄用脚本检查你访问过哪些网站的代码
Dec 04 #Javascript
jQuery)扩展jQuery系列之一 模拟alert,confirm(一)
Dec 04 #Javascript
高效的表格行背景隔行变色及选定高亮的JS代码
Dec 04 #Javascript
You might like
php excel类 phpExcel使用方法介绍
2010/08/21 PHP
PHP自动识别字符集并完成转码详解
2013/08/02 PHP
Symfony2开发之控制器用法实例分析
2016/02/05 PHP
php获取excel文件数据
2017/04/21 PHP
PHP设计模式(九)外观模式Facade实例详解【结构型】
2020/05/02 PHP
javascript 特性检测并非浏览器检测
2010/01/15 Javascript
JavaScript EasyPager 分页函数
2011/05/25 Javascript
javascript dom追加内容实现示例
2013/09/21 Javascript
js判断当前页面用什么浏览器打开的方法
2016/01/06 Javascript
浅谈Web页面向后台提交数据的方式和选择
2016/09/23 Javascript
AngularJS入门教程二:在路由中传递参数的方法分析
2017/05/27 Javascript
详解http访问解析流程原理
2017/10/18 Javascript
layer.confirm点击第一个按钮关闭弹出框的方法
2019/09/09 Javascript
Vue 打包体积优化方案小结
2020/05/20 Javascript
[56:58]VP vs Optic 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python中反射用法实例
2015/03/27 Python
python+pyqt5实现24点小游戏
2019/01/24 Python
python爬虫 爬取58同城上所有城市的租房信息详解
2019/07/30 Python
python实现静态服务器
2019/09/05 Python
使用Python画出小人发射爱心的代码
2019/11/23 Python
django-利用session机制实现唯一登录的例子
2020/03/16 Python
vue常用指令代码实例总结
2020/03/16 Python
使用pytorch实现论文中的unet网络
2020/06/24 Python
Django admin组件的使用
2020/10/24 Python
matplotlib部件之矩形选区(RectangleSelector)的实现
2021/02/01 Python
世界上最好的儿童品牌:AlexandAlexa
2018/01/27 全球购物
钳工实习自我鉴定
2013/09/19 职场文书
中专生自我鉴定范文
2014/02/02 职场文书
高中军训感言200字
2014/02/23 职场文书
校园绿化美化方案
2014/06/08 职场文书
大学拉赞助协议书范文
2014/09/26 职场文书
八年级作文之一起的走过日子
2019/09/17 职场文书
pandas取dataframe特定行列的实现方法
2021/05/24 Python
Redis模仿手机验证码发送的实现示例
2021/11/02 Redis
关于JavaScript轮播图的实现
2021/11/20 Javascript
苹果可能正在打击不进行更新的 App
2022/04/24 数码科技