使用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 不只是脚本
May 30 Javascript
jQuery 选择器项目实例分析及实现代码
Dec 28 Javascript
Jquery实现Div上下移动示例
Apr 23 Javascript
Node.js插件的正确编写方式
Aug 03 Javascript
jQuery中$.get、$.post、$.getJSON和$.ajax的用法详解
Nov 19 Javascript
JS+CSS实现简单滑动门(滑动菜单)效果
Sep 19 Javascript
js运动事件函数详解
Oct 21 Javascript
很棒的vue弹窗组件
May 24 Javascript
JavaScript箭头(arrow)函数详解
Jun 04 Javascript
基于Vue2实现简易的省市区县三级联动组件效果
Nov 05 Javascript
JS+CSS+HTML实现“代码雨”类似黑客帝国文字下落效果
Mar 17 Javascript
使用eslint和githooks统一前端风格的技巧
Jul 29 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
收音机发烧友应当熟知的100条知识
2021/03/02 无线电
Apache设置虚拟WEB
2006/10/09 PHP
『PHP』PHP截断函数mb_substr()使用介绍
2013/04/22 PHP
浅谈json_encode用法
2015/03/05 PHP
PHP中返回引用类型的方法
2015/04/03 PHP
百度工程师讲PHP函数的实现原理及性能分析(二)
2015/05/13 PHP
PHP字符串逆序排列实现方法小结【strrev函数,二分法,循环法,递归法】
2017/01/13 PHP
PHP微信网页授权的配置文件操作分析
2019/05/29 PHP
laravel框架邮箱认证实现方法详解
2019/11/22 PHP
dojo 之基础篇(二)之从服务器读取数据
2007/03/24 Javascript
Javascript中 关于prototype属性实现继承的原理图
2013/04/16 Javascript
javascript中new关键字详解
2015/12/14 Javascript
轮播的简单实现方法
2016/07/28 Javascript
使用ajaxfileupload.js实现上传文件功能
2016/08/13 Javascript
webpack+vue.js快速入门教程
2016/10/12 Javascript
微信小程序 教程之wxapp视图容器 scroll-view
2016/10/19 Javascript
完美解决node.js中使用https请求报CERT_UNTRUSTED的问题
2017/01/08 Javascript
Webpack 之 babel-loader文件预处理器详解
2018/03/23 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
2018/05/22 Javascript
如何在微信小程序中实现Mixins方案
2019/06/20 Javascript
angular中的post请求处理示例详解
2020/06/30 Javascript
Vue实现背景更换颜色操作
2020/07/17 Javascript
python+selenium 定位到元素,无法点击的解决方法
2019/01/30 Python
pandas通过字典生成dataframe的方法步骤
2019/07/23 Python
基于Python正确读取资源文件
2020/09/14 Python
日本钓鱼渔具和户外用品网上商店:naturum
2016/08/07 全球购物
俄罗斯香水和化妆品购物网站:Л’Этуаль
2018/05/10 全球购物
Paradox London官方网站:英国新娘鞋婚礼鞋品牌
2019/08/29 全球购物
美国价格实惠的在线眼镜网站:Zeelool
2020/12/25 全球购物
销售实习自我鉴定
2013/12/07 职场文书
学习优秀党务工作者先进事迹材料思想报告
2014/09/17 职场文书
装修公司工程部经理岗位职责
2015/04/09 职场文书
初中运动会前导词
2015/07/20 职场文书
六一儿童节致辞
2015/07/31 职场文书
你真的会用Mysql的explain吗
2022/03/31 MySQL
分析MySQL优化 index merge 后引起的死锁
2022/04/19 MySQL