1.官网下载开发包：/download/，选择免费的Flash版本：
2.解压后，需要用到以下几个文件：
需要修改uploadify.css中取消上传按钮的背景图片路径：
.uploadify-queue-item .cancel a {background: url('../img/uploadify-cancel.png') 0 0 no-repeat;float: right;height: 16px;text-indent: -9999px;width: 16px;}
3.页面添加样式表和脚本库的引用：
<link href="~/Content/uploadify/uploadify.css" rel="stylesheet" /><script src="~/Scripts/jquery-1.10.2.min.js"></script><script src="~/Content/uploadify/jquery.uploadify.min.js"></script>
4.页面添加用于生成上传按钮的标签：
<span id="btn_upload"></span>
5.初始化，生成按钮：
1 $(function () { 2$('#btn_upload').uploadify({ 3 uploader: '/article/upload', // 服务器处理地址 4 swf: '/Content/uploadify/uploadify.swf', 5 buttonText: "选择文件", //按钮文字 6 height: 34, //按钮高度 7 width: 82,//按钮宽度 8 fileTypeExts: "*.jpg;*.png;", //允许的文件类型 9 fileTypeDesc: "请选择图片文件", //文件说明 10 formData: { "imgType": "normal" }, //提交给服务器端的参数11 onUploadSuccess: function (file, data, response) { //一个文件上传成功后的响应事件处理12 var data = $.parseJSON(data);13 alert(data.imgpath);14 }15});16 });
6.后台代码：
1 public ActionResult Upload(HttpPostedFileBase Filedata) 2 { 3// 没有文件上传，直接返回 4if (Filedata == null || string.IsNullOrEmpty(Filedata.FileName) || Filedata.ContentLength == 0) 5{ 6 return HttpNotFound(); 7} 8 9//获取文件完整文件名(包含绝对路径)10//文件存放路径格式：/files/upload/{日期}/{md5}.{后缀名}11//例如：/files/upload/0913/43CA215D947F8C1F1DDFCED383C4D706.jpg12string fileMD5 = CommonFuncs.GetStreamMD5(Filedata.InputStream);13string FileEextension = Path.GetExtension(Filedata.FileName);14string uploadDate = DateTime.Now.ToString("yyyyMMdd");1516string imgType = Request["imgType"];17string virtualPath = "/";18if (imgType == "normal")19{20 virtualPath = string.Format("~/files/upload/{0}/{1}{2}", uploadDate, fileMD5, FileEextension);21}22else23{24 virtualPath = string.Format("~/files/upload2/{0}/{1}{2}", uploadDate, fileMD5, FileEextension);25}26string fullFileName = this.Server.MapPath(virtualPath);27 28//创建文件夹，保存文件29string path = Path.GetDirectoryName(fullFileName);30Directory.CreateDirectory(path);31if (!System.IO.File.Exists(fullFileName))32{33 Filedata.SaveAs(fullFileName);34}35 36var data = new { imgtype = imgType, imgpath = virtualPath.Remove(0, 1) };37return Json(data, JsonRequestBehavior.AllowGet);38}39 }
7.相关参数说明：
uploader: '/article/upload'请求地址，对应于后台进行处理的Action；formData:{ "imgType":"normal" }参数可以动态设置，一般在onUploadStart事件中进行处理：
onUploadStart:function(file){$("#btn_upload").uploadify("settings", "formData", { "imgType": "other","imgMode":"big") });}
如果参数名与初始化的formData中一样，参数值将覆盖，否则添加。动态设置的方法在开始上传之前执行都是可以的，该试例在两个checkbox(通过bootstrap-switch美化)的状态切换时进行设置：
$('#img_mode').on('switch-change', function (e, data) {$("#btn_upload").uploadify("settings", "formData", { "imgMode": (data.value ? "small" : "big") });});$('#img_type').on('switch-change', function (e, data) {$("#btn_upload").uploadify("settings", "formData", { "imgType": (data.value ? "normal" : "big") });});
onUploadSuccess事件处理函数的3个参数：file、data、responsefile- 包含原始文件的信息；response- 后台返回true或false；data- 后台返回的数据，试例中为Json对象；其他详细参数，参考官方文档：/documentation/
8.效果演示：
