uploadify多文件上传插件
浏览数：20 /
时间：2015年06月09日
这个插件是兼容IE8及以上版本的，实现了基本功能，底部有下载连接
代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>uploadify多文件上传插件使用</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="js/jquery-1.8.2.js"></script>
<link rel="stylesheet" type="text/css" href="js/uploadfiy/uploadify.css"/>
<style type="text/css">
#fileQueue {
background_color: #FFF;
border_radius: 3px;
/* box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25); */
border:1px solid #95B8E7;
/* box-shadow: 0 1px 3px rgba(135, 175, 255, 1); */
height: 220px;
margin-bottom: 10px;
overflow: auto;
/* padding: 5px 10px; */
width: 395px;
}
</style>
<!--这个js是经过修改的，可以兼容IE8及以上的版本-->
<script type="text/javascript" src="js/uploadfiy/jquery.uploadify.js"></script>
<script type="text/javascript">
$(document).ready(function() {
initFile();
});
function initFile() {
$("#uploadify").uploadify({
‘uploader‘: ‘FileUpLoadServlet‘,//后台处理的页面
‘swf‘ : ‘./js/uploadfiy/uploadify.swf‘,
‘script‘ : ‘‘,
‘width‘:80,
‘height‘:23,
‘folder‘ : ‘../upload‘,
‘buttonText‘ : ‘选择文件‘,
‘fileExt‘ : ‘*.*‘, //允许上传的文件格式
‘queueID‘ : ‘fileQueue‘,
‘auto‘ : false, //需要手动的提交申请
‘simUploadLimit‘:3, //同时运行上传的进程数
‘queueSizeLimit‘:10,//
‘multi‘ : true
//‘scriptData‘:{‘dept‘:‘dept1‘,‘group‘:‘group1‘}, //这个参数必须要设置成method为get，
//‘method‘:‘get‘ //后台用request.getParameter(‘name‘)获取名字的值
});
}
//用户取消函数
function funCancel(event, ID, fileObj, data) {
alert(‘您取消了‘ + fileObj.name + ‘操作‘, ‘info‘);
return;
}
//图片上传发生的事件
function funComplete(event, ID, fileObj, response, data) {
//$("#pic").html(‘<img id="pic" runat="server" src=../upload/‘ + response + ‘.jpg style="width:300;height:200px;"/>‘);
if (response == 0) {
jBox.tip(‘图片‘ + fileObj.name + ‘操作失败‘, ‘info‘);
return;
}
$("#pic").attr("src", "../upload/" + response).height(200).width(300);
jBox.tip(‘图片‘ + fileObj.name + ‘操作成功‘, ‘info‘);
return;
}
//上传发生错误时。
function funError(event, ID, fileObj, errorObj) {
jBox.tip(errorObj.info);
return;
}
</script>
</head>
<body style="background-color:white;">
<div id="maindiv" style="margin:0 auto;width:100%; text-align:center;border:1px solid #95b8e7; background-color:#F3F3F3;">
<div id="filecollection" style=" width:420px;margin:0 auto;text-align:left; margin-top:30px;margin-bottom:50px;">
<input type="file" name="uploadify" id="uploadify" />
<div id="fileQueue"></div>
<p style="font-size:12px;">
<a href="javascript:$(‘#uploadify‘).uploadify(‘upload‘,‘*‘)">上传</a>| <a
href="javascript:$(‘#uploadify‘).uploadify(‘cancel‘,‘*‘)">取消上传</a>
</p>
</div>
</div>
</body>
</html>
代码下载连接：http://download.csdn.net/detail/zhzhjieke/8411193
郑重声明：本站内容如果来自互联网及其他传播媒体，其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享，并不代表本站赞同其观点和对其真实性负责，也不构成任何其他建议。
