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一个无懈可击的实例化XMLHttpRequest的方法
Oct 13 Javascript
js编码、解码函数介绍及其使用示例
Sep 05 Javascript
jQuery之动画效果大全
Nov 09 Javascript
JS匿名函数类生成方式实例分析
Nov 26 Javascript
vue2 如何实现div contenteditable=“true”(类似于v-model)的效果
Feb 08 Javascript
JavaScript中的FileReader图片预览上传功能实现代码
Jul 24 Javascript
jQuery选择器之表单元素选择器详解
Sep 19 jQuery
详解vue项目首页加载速度优化
Oct 18 Javascript
JavaScript实现树的遍历算法示例【广度优先与深度优先】
Oct 26 Javascript
jackson解析json字符串,首字母大写会自动转为小写的方法
Dec 22 Javascript
微信小程序wx.request拦截器使用详解
Jul 09 Javascript
使用JS location实现搜索框历史记录功能
Dec 23 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
随时给自己贴的图片加文字的php水印
2007/03/16 PHP
php小偷相关截取函数备忘
2010/11/28 PHP
PHP通过iconv将字符串从GBK转换为UTF8字符集
2011/07/18 PHP
php备份数据库类分享
2015/04/14 PHP
php生成gif动画的方法
2015/11/05 PHP
Laravel中注册Facades的步骤详解
2016/03/16 PHP
Laravel 中使用简单的方法跟踪用户是否在线(推荐)
2019/10/30 PHP
jQuery Autocomplete自动完成插件
2010/07/17 Javascript
JQuery 选择和过滤方法代码总结
2010/11/19 Javascript
js编码、解码函数介绍及其使用示例
2013/09/05 Javascript
jQuery实现Div拖动+键盘控制综合效果的方法
2015/03/10 Javascript
浅谈JavaScript的Polymer框架中的behaviors对象
2015/07/29 Javascript
浅析Javascript ES6新增值比较函数Object.is
2016/08/24 Javascript
如何解决IONIC页面底部被遮住无法向上滚动问题
2016/09/06 Javascript
JavaScript错误处理和堆栈追踪详解
2017/04/18 Javascript
VUE页面中加载外部HTML的示例代码
2017/09/20 Javascript
JS计算距当前时间的时间差实例
2017/12/29 Javascript
nodejs require js文件入口,在package.json中指定默认入口main方法
2018/10/10 NodeJs
jQuery实现点击滚动到指定元素上的方法分析
2020/03/19 jQuery
vue+elementUI动态增加表单项并添加验证的代码详解
2020/12/17 Vue.js
使用PDB模式调试Python程序介绍
2015/04/05 Python
python实现上传下载文件功能
2020/11/19 Python
matplotlib中legend位置调整解析
2017/12/19 Python
Django中redis的使用方法(包括安装、配置、启动)
2018/02/21 Python
对Python协程之异步同步的区别详解
2019/02/19 Python
python将excel转换为csv的代码方法总结
2019/07/03 Python
Django2 连接MySQL及model测试实例分析
2019/12/10 Python
意大利奢侈品多品牌集合店:TheDoubleF
2019/08/24 全球购物
教师远程培训感言
2014/03/06 职场文书
股份合作协议书范本
2014/04/14 职场文书
2014年德育工作总结
2014/11/20 职场文书
考察邀请函范文
2015/01/31 职场文书
初中地理教学反思
2016/02/19 职场文书
2019大学毕业晚会主持词
2019/06/21 职场文书
使用Spring处理x-www-form-urlencoded方式
2021/11/02 Java/Android
pycharm无法安装cv2模块问题
2022/05/20 Python