1、uploadify初始化
//上传图片的方法
function ManangerUpLoad() { $('#custom_file_upload').uploadify({ swf: '../../uploadify/uploadify.swf', //上传的Flash，不用管，路径对就行 uploader: '../../uploadify/UploadifyHandler.ashx?GetFunction=UploadFile3', //Post文件到指定的处理文件 auto: false, // buttonClass:'JQButton',//浏览按钮的class buttonText: '浏览', //浏览按钮的Text cancelImage: '../../uploadify/uploadify-cancel.png', //取消按钮的图片地址 fileTypeDesc: '*.jpg;*.gif;*.png', //需过滤文件类型 fileTypeExts: '*.jpg;*.gif;*.png', //需过滤文件类型的提示 sizeLimit: 5242880, // height: 28, //浏览按钮高 // width: 52, //浏览按钮宽 multi: true, //是否允许多文件上传 uploadLimit: 999, //同时上传多少个文件 queueSizeLimit: 999, //队列允许的文件总数 removeCompleted: false, //当上传成功后是否将该Item删除 onSelect: function (file) { $('#custom_file_upload').uploadifyUpload('*'); }, //选择文件时触发事件 onSelectError: function (file, errorCode, errorMsg) { }, //选择文件有误触发事件 onUploadComplete: function (file) { }, //上传成功触发事件 onUploadError: function (file, errorCode, errorMsg) { }, //上传失败触发事件 onUploadProgress: function (file, fileBytesLoaded, fileTotalBytes) { }, //上传中触发事件 onUploadStart: function (file) { }, //上传开始触发事件 onUploadSuccess: function (event, response, status) { ChangeMissionIcon1($.parseJSON(response));// var swfuploadify = window['uploadify_custom_file_upload'];// for (var n in swfuploadify.queue.files) { // queuedFile = swfuploadify.queue.files[n];// document.getElementById("hide_file").value = queuedFile.id + ",";// } //var queuedFile = swfuploadify.queue.files[0]; //alert(queuedFile.name);//alert(file.id);
} //当单个文件上传成功后激发的事件 }); }
//成功上传图片后获取图片的路径方法
function ChangeMissionIcon1(objUploadDocumentItem) { var paths = "/Admin/UpLoad/" + objUploadDocumentItem.DocName; $('#showImg').append("<div class='" + objUploadDocumentItem.DocName.split('.')[0] + "' style='float:left;'><a href='" + paths + "' target='_blank' title='点击查看图片'><img src='" + paths + "' style='width:60px; height:60px;' /></a></div>"); document.getElementById("ipt_filepath").value += "/Admin/UpLoad/" + objUploadDocumentItem.DocName + ",";}
2、清空队列方法：1） $('#custom_file_upload').uploadifyClearQueue(); //清空队列（不好使）
2）
var swfuploadify = window['uploadify_custom_file_upload'];
$('#custom_file_upload').uploadifyClearQueue(); swfuploadify.queue.files = 0; $('#ipt_filepath').val('');3、放置地方：
<div closed="true" class="easyui-dialog" modal="true" title="<span style='color:black;'>上传图片</span>"
id="UpFile" style="width: 400px; height: 400px;" buttons="#UpFile-buttons"> <div id="custom-demo" class="demo"> <div class="demo-box"> <div id="status-message"> 请选择要上传的文件,文件类型为jpg、png、gif，大小不能超过5M</div> <div id="custom-queue"> </div> <input id="custom_file_upload" type="file" name="custom_file_upload" /> <form id="form_upload" name="form_upload" method="post"> <input type="hidden" id="ipt_filepath" name="ipt_filepath" /> <input type="hidden" id="up" name="up" value="0" /> </form> <input type="hidden" id="hide_file" name="hide_file" /> </div> </div> </div> <div id="UpFile-buttons"> <a id="btn_Submit" href="javascript:" class="easyui-linkbutton">上传图片</a> <a href="javascript:" class="easyui-linkbutton" οnclick="$('#UpFile').dialog('close');return false;">取消</a> </div> 其中ipt_filepath为路径 up为jquery的ajax异步调用方法的action
4、uploadify上传图片成功后在下边显示一个层，显示每张图片的缩略图和删除按钮，可以随时删除添加
//上传图片的方法
function ManangerUpLoad() { $('#custom_file_upload').uploadify({ swf: '../../uploadify/uploadify.swf', //上传的Flash，不用管，路径对就行 uploader: '../../uploadify/UploadifyHandler.ashx?GetFunction=UploadFile2', //Post文件到指定的处理文件 auto: false, // buttonClass:'JQButton',//浏览按钮的class buttonText: '浏览', //浏览按钮的Text cancelImage: '../../uploadify/uploadify-cancel.png', //取消按钮的图片地址 fileTypeDesc: '*.jpg;*.gif;*.png', //需过滤文件类型 fileTypeExts: '*.jpg;*.gif;*.png', //需过滤文件类型的提示 sizeLimit: 5242880, // height: 28, //浏览按钮高 // width: 52, //浏览按钮宽 multi: true, //是否允许多文件上传 uploadLimit: 4, //同时上传多少个文件 queueSizeLimit: 4, //队列允许的文件总数 removeCompleted: false, //当上传成功后是否将该Item删除 onSelect: function (file) { $('#custom_file_upload').uploadifyUpload('*'); }, //选择文件时触发事件 onSelectError: function (file, errorCode, errorMsg) { }, //选择文件有误触发事件 onUploadComplete: function (file) { }, //上传成功触发事件 onUploadError: function (file, errorCode, errorMsg) { }, //上传失败触发事件 onUploadProgress: function (file, fileBytesLoaded, fileTotalBytes) { }, //上传中触发事件 onUploadStart: function (file) { }, //上传开始触发事件 onUploadSuccess: function (event, response, status) { ChangeMissionIcon1($.parseJSON(response)); } //当单个文件上传成功后激发的事件 }); } //成功上传图片后获取图片的路径方法 function ChangeMissionIcon1(objUploadDocumentItem) { var paths = "/Public/Product/Images/" + objUploadDocumentItem.DocName; $('#showImg').append("<div class='" + objUploadDocumentItem.DocName.split('.')[0] + "' style='float:left;'><a href='" + paths + "' target='_blank' title='点击查看图片'><img src='" + paths + "' style='width:60px; height:60px;' /></a><img style='cursor:pointer;' title='删除商品图片' οnclick='DelPic(\"" + objUploadDocumentItem.DocName.split('.')[0] + "\")' src='../../uploadify/uploadify-cancel.png' /></div>"); document.getElementById("ipt_filepath").value += "/Public/Product/Images/" + objUploadDocumentItem.DocName + ","; } //删除图片 function DelPic(PicPath) { $('div').remove("." + PicPath); var path = document.getElementById("ipt_filepath").value; var p = "/Public/Product/Images/"; var p1 = p + PicPath + ".jpg,"; var p2 = p + PicPath + ".gif,"; var p3 = p + PicPath + ".png,"; path = path.replace(p1, '').replace(p2, '').replace(p3, ''); $('#ipt_filepath').val(path); $.ajax({ type: "Post", url: "/qyjx/WebServices.aspx/DeleteFile", contentType: "application/json; charset=utf-8", dataType: "json", data: "{'FileName':'" + PicPath + "'}", success: function (data) {},
error: function (err) { alert(err.responseText); } });CommonPic();
}其中调用的ajax方法为删除物理地址，方法为：
[WebMethod]
public static string DeleteFile(string FileName) { string msg = ""; string path = "/Public/Product/Images/" + FileName + ".jpg"; string path1 = "/Public/Product/Images/" + FileName + ".gif"; string path2 = "/Public/Product/Images/" + FileName + ".png"; string sql = string.Format("select * from Tb_ProductPic where FilePath='{0}' or FilePath='{1}' or FilePath='{2}'", path, path1, path2); DataTable dt = DbHelperSQL.Query(sql).Tables[0]; if (dt.Rows.Count > 0) { string IDS = ""; for (int i = 0; i < dt.Rows.Count; i++) { IDS = dt.Rows[i]["ID"].ToString() + ","; } if (IDS.EndsWith(",")) { IDS = IDS.Remove(IDS.Length - 1, 1); } sql = string.Format("delete from Tb_ProductPic where ID IN ({0})", IDS); DbHelperSQL.ExecuteSql(sql); } path = System.Web.HttpContext.Current.Server.MapPath(path); path1 = System.Web.HttpContext.Current.Server.MapPath(path1); path2 = System.Web.HttpContext.Current.Server.MapPath(path2); System.IO.FileInfo file = new System.IO.FileInfo(path); System.IO.FileInfo file1 = new System.IO.FileInfo(path1); System.IO.FileInfo file2 = new System.IO.FileInfo(path2);if (file.Exists)
{ file.Delete(); } if (file1.Exists) { file.Delete(); } if (file2.Exists) { file.Delete(); }return msg;
}