Jquery上传插件 uploadify v3.1使用说明


Posted in Javascript onJune 18, 2012

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

三水点靠木提供的下载地址:https://3water.com/jiaoben/21484.html

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

使用方法(.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

参数说明:
参考 https://3water.com/article/30598.htm
3.1 版本更新 : 去除postData,更改为formData。 Json数据。 其他更改研究中。
上传文件生成缩略图显示到网页功能研究ing。
Javascript 相关文章推荐
JavaScript 布尔操作符解析  &amp;&amp; || !
Aug 10 Javascript
javascript的字符串按引用复制和传递,按值来比较介绍与应用
Dec 28 Javascript
浅谈jquery.fn.extend与jquery.extend区别
Jul 13 Javascript
js实现点击切换TAB标签实例
Aug 21 Javascript
jquery点击缩略图切换视频播放特效代码分享
Sep 15 Javascript
jQuery实现切换页面过渡动画效果
Oct 29 Javascript
简述JavaScript提交表单的方式 (Using JavaScript Submit Form)
Mar 18 Javascript
jquery获取复选框的值的简单实例
May 26 Javascript
详解angularJS动态生成的页面中ng-click无效解决办法
Jun 19 Javascript
Node.js+Express+MySql实现用户登录注册功能
Jul 10 Javascript
Vue中Axios从远程/后台读取数据
Jan 21 Javascript
详解微信小程序支付流程与梳理
Jul 16 Javascript
uploadify 3.0 详细使用说明
Jun 18 #Javascript
通过Javascript创建一个选择文件的对话框代码
Jun 16 #Javascript
通过Javascript将数据导出到外部Excel文档的函数代码
Jun 15 #Javascript
精心挑选的15个jQuery下拉菜单制作教程
Jun 15 #Javascript
jQuery操作input type=radio的实现代码
Jun 14 #Javascript
jQuery操作 input type=checkbox的实现代码
Jun 14 #Javascript
基于jQuery的遍历同id元素 并响应事件的代码
Jun 14 #Javascript
You might like
要会喝咖啡也要会知道咖啡豆
2021/03/03 咖啡文化
动态网站web开发 PHP、ASP还是ASP.NET
2006/10/09 PHP
PHP+FastCGI+Nginx配置PHP运行环境
2014/08/07 PHP
PHPExcel实现表格导出功能示例【带有多个工作sheet】
2018/06/13 PHP
thinkphp5使用无限极分类
2019/02/18 PHP
定义JavaScript二维数组采用定义数组的数组来实现
2012/12/09 Javascript
JavaScript两种跨域技术全面介绍
2014/04/16 Javascript
JavaScript实现的圆形浮动标签云效果实例
2015/08/06 Javascript
js实现的二级横向菜单条实例
2015/08/22 Javascript
JavaScript代码性能优化总结篇
2016/05/15 Javascript
基于zepto.js简单实现上传图片
2016/06/21 Javascript
用nodejs的实现原理和搭建服务器(动态)
2016/08/10 NodeJs
javascript中json基础知识详解
2017/01/19 Javascript
bootstarp modal框居中显示的实现代码
2017/02/18 Javascript
基于vue v-for 循环复选框-默认勾选第一个的实现方法
2018/03/03 Javascript
微信小程序自定义组件实现tabs选项卡功能
2018/07/14 Javascript
es6数据变更同步到视图层的方法
2019/03/04 Javascript
vue百度地图 + 定位的详解
2019/05/13 Javascript
Vue CLI3基础学习之pages构建多页应用
2019/06/02 Javascript
layui 弹出层回调获取弹出层数据的例子
2019/09/02 Javascript
Js参数RSA加密传输之jsencrypt.js的使用
2020/02/07 Javascript
你应该知道的python列表去重方法
2017/01/17 Python
Apache,wsgi,django 程序部署配置方法详解
2019/07/01 Python
Django ModelForm组件使用方法详解
2019/07/23 Python
pytorch实现用Resnet提取特征并保存为txt文件的方法
2019/08/20 Python
python利用datetime模块计算程序运行时间问题
2020/02/20 Python
浅谈pytorch torch.backends.cudnn设置作用
2020/02/20 Python
物业管理应届生求职信
2013/10/28 职场文书
体育教育个人自荐信范文
2013/12/01 职场文书
2014年会演讲稿范文
2014/01/06 职场文书
大学生如何写自荐信
2014/01/08 职场文书
工作睡觉检讨书
2014/02/25 职场文书
服装仓管员岗位职责
2014/06/17 职场文书
乡镇领导班子批评与自我批评材料
2014/09/23 职场文书
工作失职检讨书500字
2014/10/17 职场文书
学校政风行风评议工作总结
2014/10/21 职场文书