uploadify初体验

js调用
$("#fileInput1").uploadify({
'uploader': 'images/uploadify.swf',
'script': 'uploadfile.aspx',
'cancelImg': 'images/cancel.png',
'auto': false,
'multi': true,
'sizeLimit':1024*1024*1024*1,
'simUploadLimit':1,//允许同时上传的个数
'queueSizeLimit':5,//当允许多文件生成时,设置选择文件的个数,默认值:999 。
'fileDesc':'请选择rar doc pdf文件',//提示
'fileExt':'*.doc;*.pdf;*.rar',//要求
'onSelectOnce':function (event,data){fileOkAndKiss(data);},
'onCancel':function (event,queueId,fileObj,data){fileOkAndKiss(data);},
'onProgress':function(event,queueId,fileObj,data){
$(
"#showoldfileName").html("<table id='tablefile'><tr><td align=left>文件名</td><td>文件大小</td></tr></table>");
// window.location.reload();
//
return;
//上传时触发
//完成百分比 当前上传多少 总工上传多少 上传速度(可以做判断 》1024 为M 小于则KB)
//$("#sa").html(data.percentage+" % <br>"+Math.round(data.bytesLoaded/1024/1024)+"MB<br>"+Math.round(data.allBytesLoaded/1024/1024)+"MB<br>"+Math.round(data.speed)+"KB");
},
'onError':function(event,queueId,fileObj,errorObj)
{
//错误时触发
//错误的类型,有三种‘HTTP’, ‘IO’, or ‘Security’//错误的描述
$("Span5").html(errorObj.type+"<br>"+errorObj.info).css("color","red");
},
'onComplete':function(event,queueId,fileObj,response,data)
{
$(
"#Span2").html("剩余文件:"+data.fileCount);
//把路径放到数组里边 最后统一插入到数据库
//var t=response.split('*')[0] //.split('~/')[1];
var t=response.split('*')[0];
if(t!="0")
{
fs
="<tr><td align=left>"+fileObj.name+"</td><td>"+fileBytehandle(fileObj.size)+"</td></tr>";
$(fs).appendTo($(
"#tablefile"));
fileArrayString
+=t+','+fileObj.name+','+fileBytehandle(fileObj.size)+'!';
}

},
'onAllComplete':function(event,data){

//提交到数据库
var a=QLflow.savaFile(fileArrayString,tmpid,ndid,nuid);
if(a==0)
alert(
"上传文件失败");
//上传完毕 然后清空
fileArrayString="";
//提示总工上传的个数 已上传的 错误的 最后提示正确的已插入的数据库中
}

});
c#代码 
protectedvoid Page_Load(object sender, EventArgs e)
{
Server.Execute(
"LoginAPI.aspx");
try
{
//获取上传的文件数据
HttpPostedFile file = Request.Files["Filedata"];
string fileName = file.FileName;
//由于不同浏览器取出的FileName不同(有的是文件绝对路径,有的是只有文件名),故要进行处理
if (fileName.IndexOf('\\') >-1)
{
fileName
= fileName.Substring(fileName.LastIndexOf('\\') +1);
}
elseif (fileName.IndexOf('/') >-1)
{
fileName
= fileName.Substring(fileName.LastIndexOf('/') +1);
}

//上传的目录
string uploadDir ="~/upload/";
//上传的路径
string uploadPath = uploadDir + Guid.NewGuid() + fileName.Replace(",","(逗号)");
//保存到数据库

//保存文件
file.SaveAs(Server.MapPath(uploadPath));
//下面这句代码缺少的话,上传成功后上传队列的显示不会自动消失
//Response.Write("1");
Response.Write(uploadPath+"*");
}
catch
{
Response.Write(
"0*");
}
}

html

<div class="tob">
<table id="ft" cellpadding="0" cellspacing="0" border="1" style="top:10px; position:relative; 90%; text-align:center;">
<tr>
<td>项目名称</td>
<td><input id="Text21" type="text" readonly/></td>
</tr>
<tr id="upfile">
<td>上传设计文档</td>
<td >
<br />
<span id="Span0"></span>&nbsp;&nbsp;&nbsp;&nbsp;
<span id="Span1"></span>&nbsp;&nbsp;&nbsp;&nbsp;
<span id="Span2"></span>&nbsp;&nbsp;&nbsp;&nbsp;
<span id="Span5"></span><br />
<div id="fileInput1"></div>
<a href="javascript:$('#fileInput1').uploadifyUpload()">上传</a>|
<a href="javascript:$('#fileInput1').uploadifyClearQueue()">取消上传</a>
</td>
</tr>
<tr>
<td>已上传的设计文档</td>
</tr>
</table>
</div>

jquery.uploadify.v2.1.0.min.js

View Code
//if(jQuery){(function(a){a.extend(a.fn,{uploadify:function(b){a(this).each(function(){settings=a.extend({id:a(this).attr("id"),uploader:"uploadify.swf",script:"uploadify.php",expressInstall:null,folder:"",height:30,110,cancelImg:"cancel.png",wmode:"opaque",scriptAccess:"sameDomain",fileDataName:"Filedata",method:"POST",queueSizeLimit:999,simUploadLimit:1,queueID:false,displayData:"percentage",onInit:function(){},onSelect:function(){},onQueueFull:function(){},onCheck:function(){},onCancel:function(){},onError:function(){},onProgress:function(){},onComplete:function(){},onAllComplete:function(){}},b);var e=location.pathname;e=e.split("/");e.pop();e=e.join("/")+"/";var f={};f.uploadifyID=settings.id;f.pagepath=e;if(settings.buttonImg){f.buttonImg=escape(settings.buttonImg)}if(settings.buttonText){f.buttonText=escape(settings.buttonText)}if(settings.rollover){f.rollover=true}f.script=settings.script;f.folder=escape(settings.folder);if(settings.scriptData){var g="";for(var d in settings.scriptData){g+="&"+d+"="+settings.scriptData[d]}f.scriptData=escape(g.substr(1))}f.width=settings.width;f.height=settings.height;f.wmode=settings.wmode;f.method=settings.method;f.queueSizeLimit=settings.queueSizeLimit;f.simUploadLimit=settings.simUploadLimit;if(settings.hideButton){f.hideButton=true}if(settings.fileDesc){f.fileDesc=settings.fileDesc}if(settings.fileExt){f.fileExt=settings.fileExt}if(settings.multi){f.multi=true}if(settings.auto){f.auto=true}if(settings.sizeLimit){f.sizeLimit=settings.sizeLimit}if(settings.checkScript){f.checkScript=settings.checkScript}if(settings.fileDataName){f.fileDataName=settings.fileDataName}if(settings.queueID){f.queueID=settings.queueID}if(settings.onInit()!==false){a(this).css("display","none");a(this).after('<div id="'+a(this).attr("id")+'Uploader"></div>');swfobject.embedSWF(settings.uploader,settings.id+"Uploader",settings.width,settings.height,"9.0.24",settings.expressInstall,f,{quality:"high",wmode:settings.wmode,allowScriptAccess:settings.scriptAccess});if(settings.queueID==false){a("#"+a(this).attr("id")+"Uploader").after('<div id="'+a(this).attr("id")+'Queue" class="uploadifyQueue"></div>')}}if(typeof(settings.onOpen)=="function"){a(this).bind("uploadifyOpen",settings.onOpen)}a(this).bind("uploadifySelect",{action:settings.onSelect,queueID:settings.queueID},function(j,h,i){if(j.data.action(j,h,i)!==false){var k=Math.round(i.size/1024*100)*0.01;var l="KB";if(k>1000){k=Math.round(k*0.001*100)*0.01;l="MB"}var m=k.toString().split(".");if(m.length>1){k=m[0]+"."+m[1].substr(0,2)}else{k=m[0]}if(i.name.length>20){fileName=i.name.substr(0,20)+"..."}else{fileName=i.name}queue="#"+a(this).attr("id")+"Queue";if(j.data.queueID){queue="#"+j.data.queueID}a(queue).append('<div id="'+a(this).attr("id")+h+'" class="uploadifyQueueItem"><div class="cancel"><a href="javascript:jQuery(\'#'+a(this).attr("id")+"').uploadifyCancel('"+h+'\')"><img src="'+settings.cancelImg+'" border="0" /></a></div><span class="fileName">'+fileName+" ("+k+l+')</span><span class="percentage"></span><div class="uploadifyProgress"><div id="'+a(this).attr("id")+h+'ProgressBar" class="uploadifyProgressBar"><!--Progress Bar--></div></div></div>')}});if(typeof(settings.onSelectOnce)=="function"){a(this).bind("uploadifySelectOnce",settings.onSelectOnce)}a(this).bind("uploadifyQueueFull",{action:settings.onQueueFull},function(h,i){if(h.data.action(h,i)!==false){alert("The queue is full.  The max size is "+i+".")}});a(this).bind("uploadifyCheckExist",{action:settings.onCheck},function(m,l,k,j,o){var i=new Object();i=k;i.folder=e+j;if(o){for(var h in k){var n=h}}a.post(l,i,function(r){for(var p in r){if(m.data.action(m,l,k,j,o)!==false){var q=confirm("Do you want to replace the file "+r[p]+"?");if(!q){document.getElementById(a(m.target).attr("id")+"Uploader").cancelFileUpload(p,true,true)}}}if(o){document.getElementById(a(m.target).attr("id")+"Uploader").startFileUpload(n,true)}else{document.getElementById(a(m.target).attr("id")+"Uploader").startFileUpload(null,true)}},"json")});a(this).bind("uploadifyCancel",{action:settings.onCancel},function(l,h,k,m,j){if(l.data.action(l,h,k,m,j)!==false){var i=(j==true)?0:250;a("#"+a(this).attr("id")+h).fadeOut(i,function(){a(this).remove()})}});if(typeof(settings.onClearQueue)=="function"){a(this).bind("uploadifyClearQueue",settings.onClearQueue)}var c=[];a(this).bind("uploadifyError",{action:settings.onError},function(l,h,k,j){if(l.data.action(l,h,k,j)!==false){var i=new Array(h,k,j);c.push(i);a("#"+a(this).attr("id")+h+" .percentage").text(" - "+j.type+" Error");a("#"+a(this).attr("id")+h).addClass("uploadifyError")}});a(this).bind("uploadifyProgress",{action:settings.onProgress,toDisplay:settings.displayData},function(j,h,i,k){if(j.data.action(j,h,i,k)!==false){a("#"+a(this).attr("id")+h+"ProgressBar").css("width",k.percentage+"%");if(j.data.toDisplay=="percentage"){displayData=" - "+k.percentage+"%"}if(j.data.toDisplay=="speed"){displayData=" - "+k.speed+"KB/s"}if(j.data.toDisplay==null){displayData=" "}a("#"+a(this).attr("id")+h+" .percentage").text(displayData)}});a(this).bind("uploadifyComplete",{action:settings.onComplete},function(k,h,j,i,l){if(k.data.action(k,h,j,unescape(i),l)!==false){a("#"+a(this).attr("id")+h+" .percentage").text(" - Completed");a("#"+a(this).attr("id")+h).fadeOut(250,function(){a(this).remove()})}});if(typeof(settings.onAllComplete)=="function"){a(this).bind("uploadifyAllComplete",{action:settings.onAllComplete},function(h,i){if(h.data.action(h,i)!==false){c=[]}})}})},uploadifySettings:function(f,j,c){var g=false;a(this).each(function(){if(f=="scriptData"&&j!=null){if(c){var i=j}else{var i=a.extend(settings.scriptData,j)}var l="";for(var k in i){l+="&"+k+"="+escape(i[k])}j=l.substr(1)}g=document.getElementById(a(this).attr("id")+"Uploader").updateSettings(f,j)});if(j==null){if(f=="scriptData"){var b=unescape(g).split("&");var e=new Object();for(var d=0;d<b.length;d++){var h=b[d].split("=");e[h[0]]=h[1]}g=e}return g}},uploadifyUpload:function(b){a(this).each(function(){document.getElementById(a(this).attr("id")+"Uploader").startFileUpload(b,false)})},uploadifyCancel:function(b){a(this).each(function(){document.getElementById(a(this).attr("id")+"Uploader").cancelFileUpload(b,true,false)})},uploadifyClearQueue:function(){a(this).each(function(){document.getElementById(a(this).attr("id")+"Uploader").clearFileUploadQueue(false)})}})})(jQuery)};

if(jQuery) {
(
function (a) {
a.extend(a.fn,{
uploadify:
function (b) {
a(
this).each(function () {
settings
=a.extend({
id:a(
this).attr("id"),uploader:"uploadify.swf",script:"uploadify.php",expressInstall:null,folder:"",height:30,110,cancelImg:"cancel.png",wmode:"opaque",scriptAccess:"sameDomain",fileDataName:"Filedata",method:"POST",queueSizeLimit:999,simUploadLimit:1,queueID:false,displayData:"percentage",onInit:function () {
},onSelect:
function () {
},onQueueFull:
function () {
},onCheck:
function () {
},onCancel:
function () {
},onError:
function () {
},onProgress:
function () {
},onComplete:
function () {
},onAllComplete:
function () {
}
},b);
var e=location.pathname;
e
=e.split("/");
e.pop();
e
=e.join("/")+"/";
var f={
};
f.uploadifyID
=settings.id;
f.pagepath
=e;
if(settings.buttonImg) {
f.buttonImg
=escape(settings.buttonImg)
}
if(settings.buttonText) {
f.buttonText
=escape(settings.buttonText)
}
if(settings.rollover) {
f.rollover
=true
}f.script
=settings.script;
f.folder
=escape(settings.folder);
if(settings.scriptData) {
var g="";
for(var d in settings.scriptData) {
g
+="&"+d+"="+settings.scriptData[d]
}f.scriptData
=escape(g.substr(1))
}f.width
=settings.width;
f.height
=settings.height;
f.wmode
=settings.wmode;
f.method
=settings.method;
f.queueSizeLimit
=settings.queueSizeLimit;
f.simUploadLimit
=settings.simUploadLimit;
if(settings.hideButton) {
f.hideButton
=true
}
if(settings.fileDesc) {
f.fileDesc
=settings.fileDesc
}
if(settings.fileExt) {
f.fileExt
=settings.fileExt
}
if(settings.multi) {
f.multi
=true
}
if(settings.auto) {
f.auto
=true
}
if(settings.sizeLimit) {
f.sizeLimit
=settings.sizeLimit
}
if(settings.checkScript) {
f.checkScript
=settings.checkScript
}
if(settings.fileDataName) {
f.fileDataName
=settings.fileDataName
}
if(settings.queueID) {
f.queueID
=settings.queueID
}
if(settings.onInit()!==false) {
a(
this).css("display","none");
a(
this).after('<div id="'+a(this).attr("id")+'Uploader"></div>');
swfobject.embedSWF(settings.uploader,settings.id
+"Uploader",settings.width,settings.height,"9.0.24",settings.expressInstall,f,{
quality:
"high",wmode:settings.wmode,allowScriptAccess:settings.scriptAccess
});
if(settings.queueID==false) {
a(
"#"+a(this).attr("id")+"Uploader").after('<div id="'+a(this).attr("id")+'Queue" class="uploadifyQueue"></div>')
}
}
if(typeof(settings.onOpen)=="function") {
a(
this).bind("uploadifyOpen",settings.onOpen)
}a(
this).bind("uploadifySelect",{
action:settings.onSelect,queueID:settings.queueID
},
function (j,h,i) {
if(j.data.action(j,h,i)!==false) {
// var k=Math.round(i.size/1024*100)*0.01;
//
var l="KB";
//
if(k>1000) {
//
k=Math.round(k*0.001*100)*0.01;
//
l="MB"
//
}
//
高楠
var k=Math.round(i.size/1024);
var l="KB";
if(k>1024) {
k
=Math.round(k/1024);
l="MB"
}
//end
var m=k.toString ().split(".");
if(m.length>1) {
k
=m[0]+"."+m[1].substr(0,2)
}
else {
k
=m[0]
}
if(i.name.length>20) {
fileName
=i.name.substr(0,20)+"..."
}
else {
fileName
=i.name
}queue
="#"+a(this).attr("id")+"Queue";
if(j.data.queueID) {
queue
="#"+j.data.queueID
}a(queue).append(
'<div id="'+a(this).attr("id")+h+'" class="uploadifyQueueItem"><div class="cancel"><a href="javascript:jQuery(\'#'+a(this).attr("id")+"').uploadifyCancel('"+h+'\')"><img src="'+settings.cancelImg+'" border="0" /></a></div><span class="fileName">'+fileName+" ("+k+l+')</span><span class="percentage"></span><div class="uploadifyProgress"><div id="'+a(this).attr("id")+h+'ProgressBar" class="uploadifyProgressBar"><!--Progress Bar--></div></div></div>')
}
});
if(typeof(settings.onSelectOnce)=="function") {
a(
this).bind("uploadifySelectOnce",settings.onSelectOnce)
}a(
this).bind("uploadifyQueueFull",{
action:settings.onQueueFull
},
function (h,i) {
if(h.data.action(h,i)!==false) {
alert(
"一次最多上传"+i+"个文件");
//alert("The queue is full. The max size is "+i+".")
}
});
a(
this).bind("uploadifyCheckExist",{
action:settings.onCheck
},
function (m,l,k,j,o) {
var i=new Object();
i
=k;
i.folder
=e+j;
if(o) {
for(var h in k) {
var n=h
}
}a.post(l,i,
function (r) {
for(var p in r) {
if(m.data.action(m,l,k,j,o)!==false) {
var q=confirm("Do you want to replace the file "+r[p]+"?");
if(!q) {
document.getElementById(a(m.target).attr(
"id")+"Uploader").cancelFileUpload(p,true,true)
}
}
}
if(o) {
document.getElementById(a(m.target).attr(
"id")+"Uploader").startFileUpload(n,true)
}
else {
document.getElementById(a(m.target).attr(
"id")+"Uploader").startFileUpload(null,true)
}
},
"json")
});
a(
this).bind("uploadifyCancel",{
action:settings.onCancel
},
function (l,h,k,m,j) {
if(l.data.action(l,h,k,m,j)!==false) {
var i=(j==true)?0:250;
a(
"#"+a(this).attr("id")+h).fadeOut(i,function () {
a(
this).remove()
})
}
});
if(typeof(settings.onClearQueue)=="function") {
a(
this).bind("uploadifyClearQueue",settings.onClearQueue)
}
var c=[];
a(
this).bind("uploadifyError",{
action:settings.onError
},
function (l,h,k,j) {
if(l.data.action(l,h,k,j)!==false) {
var i=new Array(h,k,j);
c.push(i);
//高楠
if(j.type=="File Size")
{
alert(
"文件大小不能超过1G");
}
//end
a("#"+a(this).attr("id")+h+" .percentage").text(" - "+j.type+" Error");
a(
"#"+a(this).attr("id")+h).addClass("uploadifyError")
}
});
a(
this).bind("uploadifyProgress",{
action:settings.onProgress,toDisplay:settings.displayData
},
function (j,h,i,k) {
if(j.data.action(j,h,i,k)!==false) {
a(
"#"+a(this).attr("id")+h+"ProgressBar").css("width",k.percentage+"%");
if(j.data.toDisplay=="percentage") {
//displayData=" - "+k.percentage+"%"
//高楠
var gnk="";
if(k.speed<1024)
{
gnk
=k.speed+"KB/s";
}
else
{
gnk
=Math.round(k.speed/1024)+"M/s";
}
displayData=
"-"+k.percentage+"%"+"-"+gnk;
//end
}if(j.data.toDisplay==
"speed") {
displayData=
"-"+k.speed+"KB/s"
}if(j.data.toDisplay==null) {
displayData
=""
}a(
"#"+a(this).attr("id")+h+" .percentage").text(displayData)
}
});
a(
this).bind("uploadifyComplete",{
action:settings.onComplete
},
function (k,h,j,i,l) {
if(k.data.action(k,h,j,unescape(i),l)!==false) {
a(
"#"+a(this).attr("id")+h+" .percentage").text(" - Completed");
a(
"#"+a(this).attr("id")+h).fadeOut(250,function () {
a(
this).remove()
})
}
});
if(typeof(settings.onAllComplete)=="function") {
a(
this).bind("uploadifyAllComplete",{
action:settings.onAllComplete
},
function (h,i) {
if(h.data.action(h,i)!==false) {
c
=[]
}
})
}
})
},uploadifySettings:
function (f,j,c) {
var g=false;
a(
this).each(function () {
if(f=="scriptData"&&j!=null) {
if(c) {
var i=j
}
else {
var i=a.extend(settings.scriptData,j)
}
var l="";
for(var k in i) {
l
+="&"+k+"="+escape(i[k])
}j
=l.substr(1)
}g
=document.getElementById(a(this).attr("id")+"Uploader").updateSettings(f,j)
});
if(j==null) {
if(f=="scriptData") {
var b=unescape(g).split("&");
var e=new Object();
for(var d=0;d<b.length;d++) {
var h=b[d].split("=");
e[h[
0]]=h[1]
}g
=e
}
return g
}
},uploadifyUpload:
function (b) {
a(
this).each(function () {
document.getElementById(a(
this).attr("id")+"Uploader").startFileUpload(b,false)
})
},uploadifyCancel:
function (b) {
a(
this).each(function () {
document.getElementById(a(
this).attr("id")+"Uploader").cancelFileUpload(b,true,false)
})
},uploadifyClearQueue:
function () {
a(
this).each(function () {
document.getElementById(a(
this).attr("id")+"Uploader").clearFileUploadQueue(false)
})
}
})
})(jQuery)
};

uploadify改名: 在后台文件

if (Session["change"] == null)
{
fileName = "JH.dbf";
Session["change"] = fileName;
}
else
{
fileName = "XM.dbf";
Session.Remove("change");
}




原文地址:https://www.cnblogs.com/0banana0/p/2182087.html