JS引入
<link href="../../Scripts/uploadify/uploadify.css" rel="stylesheet" />
<script src="../../Scripts/uploadify/jquery.uploadify.js" type="text/javascript"></script>html
<tr>
<td align="left" class="tdTextValue">图片:</td> <td align="left" class="tdDataValue"> <input name="file_upload" type="file" id="file_upload" value="" /> <input id="PicList" name="PicList" type="hidden" /> <ul class="picUpList2" id="preview"> </ul> </td> </tr> <tr> <td align="left" class="tdTextValue">视频:</td> <td align="left" class="tdDataValue"> <input name="file_upload1" type="file" id="file_upload1" value="" /> <input id="PicList1" name="PicList1" type="hidden" /> <ul class="picUpList2" id="preview1"> </ul> </td> </tr>JS代码
<script language="javascript" type="text/javascript">
$(function () {
uploadify(); uploadify1(); });
//上传图片
function uploadify() { $("#preview").html(""); $("#file_upload").uploadify({ uploader: '/Json/UploadHandler.ashx', swf: '/Scripts/uploadify/uploadify.swf', folder: '/UploadFiles/Images', buttonText: "添加文件", height: 24, width: 70, multi: false, //uploadLimit: 1, fileTypeExts: "*.jpg;*.png;*.gif;*.bmp", fileTypeDesc: "选择图片", onFallback: function () { alert("您未安装FLASH控件,无法上传!请安装FLASH控件后再试。"); }, onUploadSuccess: function (file, data, response) {$("#preview").html("");
var DataJson = JSON.parse(data);$("<li><img width=\"80\" height=\"80\" src=\"" + DataJson.FilePath.replace("~", "") + "\"><a class=\"delIcon1\" οnclick=\"RemoveImg(this)\" href=\"javascript:void(0);\"></a></li>").appendTo($("#preview"));
if ($("#PicList").val() == "" || $("#PicList").val() == null) { $("#PicList").val(DataJson.FilePath.replace("~", "")); } else { $("#PicList").val(DataJson.FilePath.replace("~", "")); } } }); }
function RemoveImg(obj) {
if (confirm("确认删除此图片吗?")) {getAjax("/Json/UploadHandler.ashx", { DelfileName: $(obj).prev().attr("src") }, function (data) {
var JsonData = eval("(" + data + ")");
if (JsonData.Code == "1") {
$("#PicList").val($("#PicList").val().replace($(obj).prev().attr("src"), ""));
var _preview = "<li><img width=\"80\" height=\"80\" src=\"" + $(obj).prev().attr("src") + "\"><a class=\"delIcon1\" οnclick=\"RemoveImg(this)\" href=\"javascript:void(0);\"></a></li>"; $("#preview").html($("#preview").html().replace(_preview, ""));alert("图片删除成功!");
} else if (JsonData.Code == "-1") { alert(JsonData.Message); return; } else { $("#PicList").val($("#PicList").val().replace($(obj).prev().attr("src"), "")); var _preview = "<li><img width=\"80\" height=\"80\" src=\"" + $(obj).prev().attr("src") + "\"><a class=\"delIcon1\" οnclick=\"RemoveImg(this)\" href=\"javascript:void(0);\"></a></li>"; $("#preview").html($("#preview").html().replace(_preview, ""));alert("没找到相应文件,图片删除失败!");
return; } }); }}
//上传视频
function uploadify1() { $("#preview1").html(""); $("#file_upload1").uploadify({ uploader: '/Json/UploadHandler.ashx', swf: '/Scripts/uploadify/uploadify.swf', folder: '/UploadFiles/Images', buttonText: "添加文件", height: 24, width: 70, //multi: false, //uploadLimit: 1, fileSizeLimit: 0, fileTypeExts: "*.flv;*.mp4", fileTypeDesc: "选择视频", onFallback: function () { alert("您未安装FLASH控件,无法上传!请安装FLASH控件后再试。"); }, onUploadSuccess: function (file, data, response) {$("#preview1").html("");
var DataJson = JSON.parse(data); $("<li><span>" + DataJson.filename + "</span><a class=\"delIcon2\" οnclick=\"RemoveImg1('" + DataJson.filename + "')\" href=\"javascript:void(0);\"></a></li>").appendTo($("#preview1")); ; if ($("#PicList1").val() == "" || $("#PicList1").val() == null) { $("#PicList1").val(DataJson.filename + ","); } else { $("#PicList1").val($("#PicList1").val() + DataJson.filename + ","); } } }); }
function RemoveImg1(name) {
if (confirm("确认删除此视频文件吗?")) { getAjax("/Json/UploadHandler.ashx", { DelfileName: "/UploadFiles/Images/" + name }, function (data) { var JsonData = eval("(" + data + ")"); if (JsonData.Code == "1") {$("#PicList1").val($("#PicList1").val().replace(name + ",", ""));
var _preview1 = "<li><span>" + name + "</span><a class=\"delIcon2\" οnclick=\"RemoveImg1('" + name + "')\" href=\"javascript:void(0);\"></a></li>"; $("#preview1").html($("#preview1").html().replace(_preview1,""));alert("视频删除成功!");
} else if (JsonData.Code == "-1") { alert(JsonData.Message); return; } else { $("#PicList1").val($("#PicList1").val().replace(name + ",", "")); var _preview1 = "<li><span>" + name + "</span><a class=\"delIcon2\" οnclick=\"RemoveImg1('" + name + "')\" href=\"javascript:void(0);\"></a></li>"; $("#preview1").html($("#preview1").html().replace(_preview1, ""));alert("没找到相应文件,视频删除失败!");
return; } }); }}
</script>
后台代码(我用的是一般处理程序文件)
public class UploadHandler : IHttpHandler
{public void ProcessRequest(HttpContext context)
{ context.Response.ContentType = "text/plain"; context.Response.Charset = "utf-8";string fileName = context.Request.Form["DelfileName"] == null ? "" : context.Request.Form["DelfileName"].ToString();
if (fileName != "") //删除图片 { string virtualPath = string.Format("~{0}", fileName); string strPath = HttpContext.Current.Server.MapPath(virtualPath); string strJson = ""; try { if (!System.IO.File.Exists(strPath)) { strJson = "{ \"Success\":false, \"Code\":\"-2\", \"Message\":\"没找到相应文件,图片删除失败!\" }"; } else { System.IO.File.Delete(strPath); strJson = " { \"Success\":true, \"Code\":\"1\", \"Message\":\"图片删除成功!\" }"; }}
catch (Exception ex) { strJson = "{ \"Success\":false, \"Code\":\"-1\", \"Message\":\"操作失败:\" " + ex.Message + " }"; } context.Response.Write(strJson); } else { HttpPostedFile file = context.Request.Files["Filedata"]; string uploadPath = HttpContext.Current.Server.MapPath("/UploadFiles/Images/") + "\\"; if (file != null) { string fileNameExit = file.FileName.Substring(file.FileName.LastIndexOf(".")).ToLower(); string strFileName = getFileName() + fileNameExit; if (!Directory.Exists(uploadPath)) { Directory.CreateDirectory(uploadPath); }file.SaveAs(uploadPath + strFileName);
string saveFile = uploadPath + strFileName; string virtualPath = string.Format("~/UploadFiles/Images/{0}", strFileName); string strJson = "{\"filename\":\"" + strFileName + "\",\"FilePath\":\"" + virtualPath + "\"}";if (!(CheckTextFile(saveFile) == FileExtension.PNG || CheckTextFile(saveFile) == FileExtension.BMP || CheckTextFile(saveFile) == FileExtension.GIF || CheckTextFile(saveFile) == FileExtension.JPG || CheckTextFile(saveFile) == FileExtension.filelist || CheckTextFile(saveFile) == FileExtension.filexlist || CheckTextFile(saveFile) == FileExtension.rar || CheckTextFile(saveFile) == FileExtension.pdf || CheckTextFile(saveFile) == FileExtension.mp4 || CheckTextFile(saveFile) == FileExtension.flv))
{ File.Delete(saveFile); strJson = "{\"filename\":\"\",\"FilePath\":\"\"}"; //扩展名不对 }context.Response.Write(strJson);
} else { //context.Response.Write("0"); context.Response.Write("{\"filename\":\"\",\"FilePath\":\"\"}"); } } }//删除图片
public void DeleteUploadFile(HttpContext context,string fileName) { }/// <summary>
/// 得到随机的文件名 /// </summary> /// <returns></returns> public static string getFileName() { Random rd = new Random(); StringBuilder serial = new StringBuilder(); serial.Append(DateTime.Now.ToString("yyyyMMddHHmmssff")); serial.Append(rd.Next(0, 9999).ToString()); return serial.ToString(); } public static FileExtension CheckTextFile(string fileName) { FileStream fs = new FileStream(fileName, FileMode.Open, FileAccess.Read); System.IO.BinaryReader br = new System.IO.BinaryReader(fs); string fileType = string.Empty; ; try { byte data = br.ReadByte(); fileType += data.ToString(); data = br.ReadByte(); fileType += data.ToString(); FileExtension extension; try { extension = (FileExtension)Enum.Parse(typeof(FileExtension), fileType); } catch {extension = FileExtension.VALIDFILE;
} return extension; } catch (Exception ex) { return FileExtension.VALIDFILE; } finally { if (fs != null) { fs.Close(); br.Close(); } } }public enum FileExtension
{ JPG = 255216, GIF = 7173, PNG = 13780, BMP = 6677, rar = 8297, pdf = 3780, filelist = 208207,//xls.doc.ppt filexlist = 8075, //xlsx,zip,pptx,docx,mmap,zip flv = 7076, mp4 = 00, //apk = 8075, //SWF = 6787, //ZIP = 8075, //_7Z = 55122, VALIDFILE = 9999999 // 255216 jpg;// 7173 gif;
// 6677 bmp,
// 13780 png;
// 6787 swf
// 7790 exe dll,
// 55122 7z
// 6063 xml
// 6033 html
// 239187 aspx
// 117115 cs
// 119105 js
// 102100 txt
// 255254 sql
}
public bool IsReusable
{ get { return false; } } }