jQuery上传插件-uploadify3.1使用说明

uploadify ,简单实用的flash上传组件,兼容性良好。 现已有html5版本。

官方地址:http://www.uploadify.com/

官方英文文档:http://www.uploadify.com/documentation/

DemosDownload

使用方法(.net版本):

前台JS

$("#id").uploadify({

height: 30,

swf: '/uploadify/uploadify.swf',

uploader: '/Handler/uploadPic.ashx',

width: 120,

cancelImg: '/uploadify/uploadify-cancel.png',

buttonText: '选择图片',

fileTypeExts: '*.gif;*.jpg;*.jpeg;*.png',

'fileSizeLimit': '6000KB',

removeCompleted: false,

'formData': {

"id":"1"

},

onUploadSuccess: function (file, data, response) {//上传完成时触发(每个文件触发一次)

if (data.indexOf('错误提示') > -1) {

alert(data);

}

else {

//$("#previewImage").attr("src", data.substr(2)).hide().fadeIn(2000);

alert("上传成功!");

}

},

'onUploadError': function (file, errorCode, errorMsg, errorString) {//当单个文件上传出错时触发

alert('文件:' + file.name + ' 上传失败: ' + errorString);

}

});

ASHX文件:

protected string AllowExt = "7z|aiff|asf|avi|bmp|csv|doc|docx|fla|flv|gif|gz|gzip|jpeg|jpg|mid|mov|mp3|mp4|mpc|mpeg|mpg|ods|odt|pdf|png|ppt|pptx|pxd|qt|ram|rar|rm|rmi|rmvb|rtf|sdc|sitd|swf|sxc|sxw|tar|tgz|tif|tiff|txt|vsd|wav|wma|wmv|xls|xlsx|xml|zip";//支持的文件格式

int FileMaxSize = 10240;//文件大小,单位为Kpublicvoid ProcessRequest(HttpContext context)

{

context.Response.ContentType = "text/plain";

string ParentID = context.Request.Params["id"];

HttpPostedFile fileUpload = context.Request.Files[0];

if (fileUpload != null)

{

try

{

string UploadDir = "~/upload/";//图片保存的文件夹

//图片保存的文件夹路径

string path = context.Server.MapPath(UploadDir);

//每天上传的图片一个文件夹

string folder = DateTime.Now.ToString("yyyyMM");

//如果文件夹不存在,则创建

if (!Directory.Exists(path + folder))

{

Directory.CreateDirectory(path + folder);

}

//上传图片的扩展名

string fileExtension = fileUpload.FileName.Substring(fileUpload.FileName.LastIndexOf('.'));

//判断文件格式

if (!CheckValidExt(fileExtension))

{

context.Response.Write("错误提示:文件格式不正确!" + fileExtension);

return;

}

//判断文件大小

if (fileUpload.ContentLength > FileMaxSize * 1024)

{

context.Response.Write("错误提示:上传的文件(" + fileUpload.FileName + ")超过最大限制:" + FileMaxSize + "KB");

return;

}

//保存图片的文件名

//string saveName = Guid.NewGuid().ToString() + fileExtension;

//使用时间+随机数重命名文件

string strDateTime = DateTime.Now.ToString("yyMMddhhmmssfff");//取得时间字符串

Random ran = new Random();

string strRan = Convert.ToString(ran.Next(100, 999));//生成三位随机数

string saveName = strDateTime + strRan + fileExtension;

Model.Album uc = new Model.Album();

uc.Title = fileUpload.FileName;

uc.ImagePath = folder + "/" + saveName;

uc.PostTime = DateTime.Now;

uc.Pid= int.Parse(id);

bll.Album alb = new bll.Album();

alb.add(uc);

//保存图片

fileUpload.SaveAs(path + folder + "/" + saveName);

context.Response.Write(UploadDir + folder + "/" + saveName);

}

catch

{

context.Response.Write("错误提示:上传失败");

}

}

}

public bool IsReusable

{

get

{

return false;

}

}

#region 检测扩展名的有效性 bool CheckValidExt(string sExt)

/// <summary>

/// 检测扩展名的有效性

/// </summary>

/// <param name="sExt">文件名扩展名</param>

/// <returns>如果扩展名有效,返回true,否则返回false.</returns>

public bool CheckValidExt(string strExt)

{

bool flag = false;

string[] arrExt = AllowExt.Split('|');

foreach (string filetype in arrExt)

{

if (filetype.ToLower() == strExt.ToLower().Replace(".", ""))

{

flag = true;

break;

}

}

return flag;

}

#endregion

参数说明

参考 http://www.cnblogs.com/luohu/archive/2011/12/16/2290135.html#commentform

3.1 版本更新 : 去除postData,更改为formData。 Json数据。 其他更改研究中。

上传文件生成缩略图,将缩略图以data为参数传回页面显示到准备好的容器中。

onUploadSuccess: function (file, data, response) {//上传完成时触发(每个文件触发一次)

if (data.indexOf('错误提示') > -1) {

alert(data);

}

else {

//$("#previewImage").attr("src", data.substr(2)).hide().fadeIn(2000);

alert("上传成功!");

jQuery("#albumList").append("<img src='"+data+"' />");

}

},

'onUploadError': function (file, errorCode, errorMsg, errorString) {//当单个文件上传出错时触发

alert('文件:' + file.name + ' 上传失败: ' + errorString);}

参考: http://www.cnblogs.com/luohu/archive/2011/12/16/2290135.html#commentform