1、uploadify插件库引用
<script src="../js/uploadify/swfobject.js" type="text/javascript"></script> <script src="../js/uploadify/jquery.uploadify.v2.1.4.js" type="text/javascript"></script>
2、uploadify应用代码
$('#uploadify').uploadify({ 'uploader': '../js/uploadify/uploadify.swf', //指定上传控件的主体文件 'script': 'Handler/UpAdImg.ashx', //指定服务器端上传处理文件 'scriptData': { 'uptype': 'Upload', 'option': 'GoodsImgUpdate' }, 'cancelImg': '../js/uploadify/cancel.png', //指定取消上传的图片 'auto': true, //选定文件后是否自动上传 'fileExt': '*.jpg;*.gif;*.png;*.pdf;*.rar;*.zip;*.exe;*.xls;*.xlsx;*.ppt;*.pptx;*.doc;*.docx;', //控制可上传文件的扩展名,启用本项时需同时声明filedesc 'fileDesc': '图片格式(*.jpg;*.gif;*.png;*.pdf;*.rar;*.zip;*.exe;)', //出现在上传对话框中的文件类型描述 'buttonText': '上传图片', //浏览按钮的文本 'sizelimit': 824288000, //控制上传文件的大小,单位byte 'multi': true, //是否允许同时上传多文件 'onComplete': function (event, queueId, fileObj, response, data) { var resultJson = eval("(" + response + ")"); if (resultJson.success == true) { var li = $("<li>" + "<input name=\"hd_upimgId\" type=\"hidden\" value=\"0\" /><input name=\"hd_FileName\" type=\"hidden\" value=\"" + resultJson.src + "\" /><input name=\"HD_ImageType\" type=\"hidden\" id=\"HD_ImageType\" value=''/>" + "<div class=\"jPic\"><span><img src=\"" + resultJson.url + "\" width='160' height='160' /></span><i class=\"webNo\"></i></div>" + "<div class=\"jwz\"><div class=\"w1\">名称:<input name=\"txtTitle\" class=\"jbox\" type=\"text\" value='" + resultJson.title + "'/></div><div class=\"w1\">说明:<input name=\"txtRemark\" class=\"jbox\" id=\"txtRemark\" type=\"text\"/></div><div class=\"jBtn\"><i class=\"fx\" ><input type=\"checkbox\" /></i><a class=\"prev\" href=\"javascript:void(0);\"><img src='../images/inc/left.png' border='0' /></a><a class=\"del\" href=\"javascript:void(0);\"><img src='../images/inc/del.png' border='0' /></a><a class=\"next\" href=\"javascript:void(0);\"><img src='../images/inc/right.png' border='0' class=\"next\"/></a></div></div>" + "</li>"); bindImageItemEvent(li); $("#imageList").append(li); } } });
3、file控件代码
<td style="width: 130px;"><input id="uploadify" name="uploadify" type="file" /></td>
4、一般处理文件
public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; context.Response.Charset = "utf-8"; var HttpFile = context.Request.Files["Filedata"]; if (HttpFile != null) { var allowedExt = new List<string> { ".jpg", ".gif", ".bmp", ".png" }; var fileExt = Path.GetExtension(HttpFile.FileName).ToLower(); var File_Name = Path.GetFileNameWithoutExtension(HttpFile.FileName); var uptype = context.Request["uptype"]; var option = context.Request["option"]; if (uptype.ToString().Trim().Equals("Upload")) { var toFileName = Guid.NewGuid().ToString() + fileExt; var toFileFullPath = RouteHelp.GoodsSavePath + "\\"; var viewPath = RouteHelp.GoodsImgUrl + "\\"; var Title = File_Name; DirectoryInfo di = new DirectoryInfo(toFileFullPath); if (!di.Exists) { di.Create(); } string saveFile = toFileFullPath + "D" + toFileName; HttpFile.SaveAs(saveFile); //大缩略图 string bigThumbPath = toFileFullPath + "X" + toFileName; MakeThumbnail(saveFile, bigThumbPath, 430, 430, "Cut "); //小缩略图 string smallThumbPath = toFileFullPath + toFileName; MakeThumbnail(saveFile, smallThumbPath, 177, 177, "Cut "); string imgeUrl = ""; if (fileExt.ToLower().Equals(".jpg") || fileExt.ToLower().Equals(".gif") || fileExt.ToLower().Equals(".bmp") || fileExt.ToLower().Equals(".png")) { imgeUrl = viewPath + toFileName; } else { context.Response.Write("{success:false,msg:'只能上传图片类型的文件'}"); context.Response.End(); return; } AddImgToCookie(toFileName, toFileName, Title, option); context.Response.Write("{success:true,url:'" + RouteHelp.GoodsImgUrl + "/" + toFileName + "',src:'" + toFileName + "',title:'" + Title + "'}"); } else { context.Response.Write("{success:false}"); } } else { context.Response.Write("{success:false}"); } }