使用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 相关文章推荐
jquery插件制作教程 txtHover
Aug 17 Javascript
jquery网页回到顶部效果(图标渐隐,自写)
Jun 16 Javascript
jQuery中$.each使用详解
Jan 29 Javascript
jQuery获得子元素个数的方法
Apr 14 Javascript
jQuery取消ajax请求的方法
Jun 09 Javascript
javascript生成不重复的随机数
Jul 17 Javascript
jQuery列表检索功能实现代码
Jul 17 jQuery
VUE 全局变量的几种实现方式
Aug 22 Javascript
Makefile/cmake/node-gyp中区分判断不同平台的方法
Dec 18 Javascript
判断“命令按钮”是否被鼠标单击详解
Jul 31 Javascript
微信小程序自定义导航栏(模板化)
Nov 15 Javascript
原生JavaScript实现滑动拖动验证的示例代码
Dec 06 Javascript
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
使用pthreads实现真正的PHP多线程(需PHP5.3以上版本)
2014/05/05 PHP
Mac OS下配置PHP+MySql环境
2015/02/25 PHP
PHPExcel实现的读取多工作表操作示例
2020/04/14 PHP
通过js脚本复制网页上的一个表格的不错实现方法
2006/12/29 Javascript
javascript十六进制及二进制转化的方法
2015/05/06 Javascript
JS实现兼容各浏览器解析XML文档数据的方法
2015/06/01 Javascript
javascript+html5实现绘制圆环的方法
2015/07/28 Javascript
编写高性能Javascript代码的N条建议
2015/10/12 Javascript
JCrop+ajaxUpload 图像切割上传的实例代码
2016/07/20 Javascript
第一次动手实现bootstrap table分页效果
2016/09/22 Javascript
Nodejs进阶:如何将图片转成datauri嵌入到网页中去实例
2016/11/21 NodeJs
JS数组操作中的经典算法实例讲解
2017/07/26 Javascript
vue判断input输入内容全是空格的方法
2018/03/02 Javascript
详解webpack运行Babel教程
2018/06/13 Javascript
详解javascript appendChild()的完整功能
2018/08/18 Javascript
详细讲解如何创建, 发布自己的 Vue UI 组件库
2019/05/29 Javascript
js消除图片小游戏代码
2019/12/11 Javascript
使用vue实现HTML页面生成图片的方法
2020/03/12 Javascript
[03:02]生活中的Dendi之野外度假篇
2016/08/09 DOTA
[01:02:18]VGJ.S vs infamous Supermajor 败者组 BO3 第一场 6.4
2018/06/05 DOTA
Python出现segfault错误解决方法
2016/04/16 Python
Python随机生成手机号、数字的方法详解
2017/07/21 Python
异步任务队列Celery在Django中的使用方法
2018/06/07 Python
Django中的ajax请求
2018/10/19 Python
python基于paramiko将文件上传到服务器代码实现
2019/07/08 Python
解决Python对齐文本字符串问题
2019/08/28 Python
python实现连续变量最优分箱详解--CART算法
2019/11/22 Python
python使用pandas抽样训练数据中某个类别实例
2020/02/28 Python
工程师岗位职责
2013/11/08 职场文书
公司培训心得体会
2014/01/03 职场文书
车辆转让协议书
2014/04/15 职场文书
上海世博会志愿者口号
2014/06/17 职场文书
员工年终自我评价
2014/09/14 职场文书
小学德育工作总结2015
2015/05/12 职场文书
校园广播站开场白
2015/06/01 职场文书
MySQL 原理与优化之Update 优化
2022/08/14 MySQL