使用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 相关文章推荐
Javascript(AJAX)解析XML的代码(兼容FIREFOX/IE)
Jul 11 Javascript
js change,propertychange,input事件小议
Dec 20 Javascript
图片上传判断及预览脚本的效果实例
Aug 07 Javascript
jquery事件重复绑定的快速解决方法
Jan 03 Javascript
javascript 小数取整简单实现方式
May 30 Javascript
jQuery实现信息提示框(带有圆角框与动画)效果
Aug 07 Javascript
深入浅析JavaScript的API设计原则
Jun 14 Javascript
浅谈angularjs $http提交数据探索
Jan 20 Javascript
AngularJS 实现点击按钮获取验证码功能实例代码
Jul 13 Javascript
JavaScript实现body内任意节点的自定义属性功能示例
Sep 18 Javascript
AngularJS中ng-options实现下拉列表的数据绑定方法
Aug 13 Javascript
Vue利用localStorage本地缓存使页面刷新验证码不清零功能的实现
Sep 04 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
php语言流程控制中的主动与被动
2012/11/05 PHP
深入eAccelerator与memcached的区别详解
2013/06/06 PHP
PHP使用Alexa API获取网站的Alexa排名例子
2014/06/12 PHP
在Javascript中定义对象类别
2006/12/22 Javascript
JS操作JSON要领详细总结
2013/08/25 Javascript
JS与C#编码解码
2013/12/03 Javascript
jquery实现仿新浪微博评论滚动效果
2015/08/06 Javascript
js获取隐藏元素宽高的实现方法
2016/05/19 Javascript
bootstrap 表单验证使用方法
2017/01/11 Javascript
JavaScript中的回调函数实例讲解
2019/01/27 Javascript
vue+node 实现视频在线播放的实例代码
2020/10/19 Javascript
[01:14:35]DOTA2上海特级锦标赛B组资格赛#1 Alliance VS Fnatic第一局
2016/02/26 DOTA
python中根据字符串调用函数的实现方法
2016/06/12 Python
Python标准库sched模块使用指南
2017/07/06 Python
python操作文件的参数整理
2019/06/11 Python
python实现微信打飞机游戏
2020/03/24 Python
Python中有几个关键字
2020/06/04 Python
Python实现http接口自动化测试的示例代码
2020/10/09 Python
美国最大的半成品净菜电商:Blue Apron(蓝围裙)
2018/04/27 全球购物
Theflamel意大利:女士奢华服装、鞋子和配件
2020/01/11 全球购物
法国亚马逊官方网站:Amazon.fr
2020/12/19 全球购物
办公室文秘自我评价
2013/09/21 职场文书
求职简历的自我评价怎样写好
2013/10/07 职场文书
2014基层党员批评与自我批评范文
2014/09/24 职场文书
群众路线四风问题整改措施
2014/09/27 职场文书
公司领导班子对照检查存在问题整改措施
2014/10/02 职场文书
幼儿园感恩节活动方案2014
2014/10/11 职场文书
迟到检讨书
2015/01/26 职场文书
奖金申请报告模板
2015/05/15 职场文书
退休欢送会主持词
2015/07/01 职场文书
婚礼上证婚人致辞
2015/07/28 职场文书
体育教师研修感悟
2015/11/18 职场文书
酒吧七夕情人节宣传语
2015/11/24 职场文书
公开致歉信
2019/06/24 职场文书
Redis模仿手机验证码发送的实现示例
2021/11/02 Redis
pytorch分类模型绘制混淆矩阵以及可视化详解
2022/04/07 Python