使用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 相关文章推荐
让Firefox支持event对象实现代码
Nov 07 Javascript
javascript 面向对象的JavaScript类
May 04 Javascript
js动画效果制件让图片组成动画代码分享
Jan 14 Javascript
纯JS实现本地图片预览的方法
Jul 31 Javascript
jQuery实现的fixedMenu下拉菜单效果代码
Aug 24 Javascript
JS+CSS实现的简单折叠展开多级菜单效果
Sep 12 Javascript
初识简单却不失优雅的Vue.js
Sep 12 Javascript
vue.js获取数据库数据实例代码
May 26 Javascript
JS数组操作中的经典算法实例讲解
Jul 26 Javascript
JS中判断某个字符串是否包含另一个字符串的五种方法
May 03 Javascript
vue中使用heatmapjs的示例代码(结合百度地图)
Sep 05 Javascript
JavaScript遍历DOM元素的常见方式示例
Feb 16 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 实例化类的一点摘记
2008/03/23 PHP
php中var_export与var_dump的区别分析
2010/08/21 PHP
phpmyadmin打开很慢的解决方法
2014/04/21 PHP
php继承中方法重载(覆盖)的应用场合
2015/02/09 PHP
php删除文本文件中重复行的方法
2015/04/28 PHP
PHP空值检测函数与方法汇总
2017/11/19 PHP
如何确保JavaScript的执行顺序 之jQuery.html深度分析
2011/03/03 Javascript
jQuery用unbind方法去掉hover事件及其他方法介绍
2013/03/18 Javascript
基于jquery实现控制经纬度显示地图与卫星
2013/05/20 Javascript
Jquery遍历节点的方法小集
2014/01/22 Javascript
angular.foreach 循环方法使用指南
2015/01/06 Javascript
js创建数组的简单方法
2016/07/27 Javascript
js实现加载更多功能实例
2016/10/27 Javascript
JS随机排序数组实现方法分析
2017/10/11 Javascript
Vue脚手架的简单使用实例
2018/07/10 Javascript
使用pkg打包Node.js应用的方法步骤
2018/10/19 Javascript
Vue中跨域及打包部署到nginx跨域设置方法
2019/08/26 Javascript
在实例中重学JavaScript事件循环
2020/12/03 Javascript
[02:50]2014DOTA2 TI预选赛预选赛 大神专访第一弹!
2014/05/21 DOTA
[03:45]Newbee战队出征西雅图 决战2016国际邀请赛
2016/08/02 DOTA
python 基础学习第二弹 类属性和实例属性
2012/08/27 Python
Python实现一个简单的MySQL类
2015/01/07 Python
Python的设计模式编程入门指南
2015/04/02 Python
Python使用django获取用户IP地址的方法
2015/05/11 Python
Python内建数据结构详解
2016/02/03 Python
Python根据指定日期计算后n天,前n天是哪一天的方法
2018/05/29 Python
Python这样操作能存储100多万行的xlsx文件
2019/04/16 Python
Python函数式编程指南:对生成器全面讲解
2019/11/19 Python
python3通过qq邮箱发送邮件以及附件
2020/05/20 Python
CSS3模块的目前的状况分析
2010/02/24 HTML / CSS
什么是数据抽象
2016/11/26 面试题
《天使的翅膀》读后感3篇
2019/12/20 职场文书
Python3 多线程(连接池)操作MySQL插入数据
2021/06/09 Python
CSS实现隐藏搜索框功能(动画正反向序列)
2021/07/21 HTML / CSS
解决IDEA翻译插件Translation报错更新TTK失败不能使用
2022/04/24 Python
错误码NET::ERR_CERT_DATE_INVALID证书已过期解决方法?
2022/07/07 数码科技