使用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 相关文章推荐
JS实现图片预加载无需等待
Dec 21 Javascript
javascript实现日期格式转换
Dec 16 Javascript
jQuery使用removeClass方法删除元素指定Class的方法
Mar 26 Javascript
jQuery插件Tooltipster实现漂亮的工具提示
Apr 12 Javascript
模拟javascript中的sort排序(简单实例)
Aug 17 Javascript
javascript阻止事件冒泡和浏览器的默认行为
Jan 21 Javascript
js实现图片懒加载效果
Jul 17 Javascript
微信小程序之前台循环数据绑定
Aug 18 Javascript
详解动画插件wow.js的使用方法
Sep 13 Javascript
JS使用贪心算法解决找零问题示例
Nov 27 Javascript
详解element-ui动态限定的日期范围选择器代码片段
Jul 03 Javascript
vue使用element-ui实现表单验证
Dec 13 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快速推送微信模板消息
2017/04/14 PHP
Firefox下提示illegal character并出现乱码的原因
2010/03/25 Javascript
js实现幻灯片效果(基于jquery插件)
2013/11/05 Javascript
JS取文本框中最小值的简单实例
2013/11/29 Javascript
nodejs读取memcache示例分享
2014/01/02 NodeJs
js绘制圆形和矩形的方法
2015/08/05 Javascript
jQuery插件jquery-barcode实现条码打印的方法
2015/11/25 Javascript
jQuery Validate表单验证入门学习
2015/12/18 Javascript
JavaScript 身份证号有效验证详解及实例代码
2016/10/20 Javascript
Angular 常用指令实例总结整理
2016/12/13 Javascript
微信小程序 slider 详解及实例代码
2017/01/10 Javascript
vuex实现登录状态的存储,未登录状态不允许浏览的方法
2018/03/09 Javascript
详解在Vue中使用TypeScript的一些思考(实践)
2018/07/06 Javascript
[03:43]TI9战队采访——PSG.LGD
2019/08/22 DOTA
Python中的集合类型知识讲解
2015/08/19 Python
Python中str.join()简单用法示例
2018/03/20 Python
tensorflow学习笔记之简单的神经网络训练和测试
2018/04/15 Python
详谈python在windows中的文件路径问题
2018/04/28 Python
Windows 8.1 64bit下搭建 Scrapy 0.22 环境
2018/11/18 Python
python判断文件是否存在,不存在就创建一个的实例
2019/02/18 Python
Python基础之条件控制操作示例【if语句】
2019/03/23 Python
python实现爬山算法的思路详解
2019/04/09 Python
Python使用到第三方库PyMuPDF图片与pdf相互转换
2019/05/03 Python
Pandas之Dropna滤除缺失数据的实现方法
2019/06/25 Python
selenium+PhantomJS爬取豆瓣读书
2019/08/26 Python
Pycharm内置终端及远程SSH工具的使用教程图文详解
2020/03/19 Python
瑞典快乐袜子:Happy Socks
2018/02/16 全球购物
PHP如何与mysql建立链接
2013/05/05 面试题
Linux如何为某个操作添加别名
2013/03/01 面试题
会计师事务所审计实习自我鉴定
2013/09/20 职场文书
车间主管岗位职责
2013/11/14 职场文书
30年同学聚会邀请函
2014/01/25 职场文书
企业文化口号
2014/06/12 职场文书
关于工作经历的证明书
2014/10/11 职场文书
教师批评与自我批评心得体会
2014/10/16 职场文书
python缺失值填充方法示例代码
2022/12/24 Python