0.先去官網下載插件 下載uploadify3.2.1插件
解壓後只需要一下文件：
（1） jquery.uploadify.min.js
（2） uploadify.css
（3） uploadify.swf
但是運用到網站後需要應用Jquery 1.4以上版本
1.ASP.NET Web Form
簡單配置.ASPX文件
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<link type="text/css" rel="stylesheet" href="Content/uploadify/uploadify.css" />
<script type="text/javascript" src="Scripts/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="Content/uploadify/jquery.uploadify.min.js"></script>
</head>
<body>
<input id="file_upload" name="file_upload" type="file" multiple="multiple"/>
<script type="text/javascript">
$(document).ready(function () {
$("#file_upload").uploadify({
'swf': 'Content/uploadify/uploadify.swf',
'auto': true,
'multi': true,
'uploader': 'UploadHandler.ashx',//指定一般處理程序 執行上傳後的文件處理
});
});
</script>
</body>
</html>
創建一般處理程序 重新 ProcessRequest
public void ProcessRequest(HttpContext context)
{
context.Response.ContentType = "text/plain";
context.Response.Charset="UTF-8";
HttpPostedFile file=context.Request.Files["Filedata"];
//這個Filedata 是uploadify fileObjName項的默認值
string path = HttpContext.Current.Server.MapPath("~/LoadFiles") + "\\";
if (file != null)
{
file.SaveAs(path+file.FileName);
}
}配置View
<link type="text/css" rel="stylesheet" [email protected]("~/Content/uploadify/uploadify.css") />
<script type="text/javascript" [email protected]("~/Scripts/jquery-1.7.1.min.js")></script>
//我試了很多次，一定要引用Url.Content輔助方法才行
<script type="text/javascript" [email protected]("~/Content/uploadify/jquery.uploadify.min.js")></script>
<script type="text/javascript">
$(function () {
$("#file_upload").uploadify({
'swf': '@Url.Content("~/Content/uploadify/uploadify.swf")',
'auto': true,
'multi': true,
'uploader': 'Person/Upload'
});
});
</script>
<input id="file_upload" name="file_upload" type="file" multiple="multiple"/>編寫Action 只要捕獲到Filedata接算是成功了
[HttpPost]
public ActionResult Upload(HttpPostedFileBase Filedata)
//Filedata不能改名 因爲它是uploadify fileObjName項的默認值 除非修改 fileObjName項的默認值
//不然會報錯
{
if (Filedata != null)
{
//do something.
}
return View();
}3.ASP.NET MVC4
配置View
<link type="text/css" rel="stylesheet" [email protected]("~/Content/uploadify/uploadify.css") />
<script type="text/javascript" [email protected]("~/Scripts/jquery-1.7.1.min.js")></script>
<script type="text/javascript" [email protected]("~/Content/uploadify/jquery.uploadify.min.js")></script>
<script type="text/javascript">
$(function () {
$("#file_upload").uploadify({
'swf': '@Url.Content("~/Content/uploadify/uploadify.swf")',
'auto': true,
'multi': true,
'uploader': '@Url.Action("Upload","Person")',
'folder': 'UpLoadFiles'
});
});
</script>
<input id="file_upload" name="file_upload" type="file" multiple="multiple"/>
：其實和MVC3差不多，只是有一個地方不明白，在MVC4中
'uploader': '@Url.Action("Upload","Person")' 寫成
'uploader': 'Person/Upload' 會報錯。。。。
編寫Action 和MVC3 一樣
[HttpPost]
public ActionResult Upload(HttpPostedFileBase Filedata)
{
if (Filedata != null)
{
//do something
}
return View();
}以上只是uploadify插件的簡單運用，其還有更多的功能需要慢慢學習
uploadify 3.2.1 參數項:
// Required Settings
id : $this.attr('id'), // The ID of the DOM object
swf : 'uploadify.swf', // The path to the uploadify SWF file
uploader : 'uploadify.php', // The path to the server-side upload script
// Options
auto : true, // Automatically upload files when added to the queue
buttonClass : '', // A class name to add to the browse button DOM object
buttonCursor : 'hand', // The cursor to use with the browse button
buttonImage : null, // (String or null) The path to an image to use for the Flash browse button if not using CSS to style the button
buttonText : 'SELECT FILES', // The text to use for the browse button
checkExisting : false, // The path to a server-side script that checks for existing files on the server
debug : false, // Turn on swfUpload debugging mode
fileObjName : 'Filedata', // The name of the file object to use in your server-side script
fileSizeLimit : 0, // The maximum size of an uploadable file in KB (Accepts units B KB MB GB if string, 0 for no limit)
fileTypeDesc : 'All Files', // The description for file types in the browse dialog
fileTypeExts : '*.*', // Allowed extensions in the browse dialog (server-side validation should also be used)
height : 30, // The height of the browse button
itemTemplate : false, // The template for the file item in the queue
method : 'post', // The method to use when sending files to the server-side upload script
multi : true, // Allow multiple file selection in the browse dialog
formData : {}, // An object with additional data to send to the server-side upload script with every file upload
preventCaching : true, // Adds a random value to the Flash URL to prevent caching of it (conflicts with existing parameters)
progressData : 'percentage', // ('percentage' or 'speed') Data to show in the queue item during a file upload
queueID : false, // The ID of the DOM object to use as a file queue (without the #)
queueSizeLimit : 999, // The maximum number of files that can be in the queue at one time
removeCompleted : true, // Remove queue items from the queue when they are done uploading
removeTimeout : 3, // The delay in seconds before removing a queue item if removeCompleted is set to true
requeueErrors : false, // Keep errored files in the queue and keep trying to upload them
successTimeout : 30, // The number of seconds to wait for Flash to detect the server's response after the file has finished uploading
uploadLimit : 0, // The maximum number of files you can upload
width : 120, // The width of the browse button