jQuery上传插件Uploadify 3.2使用

loyating 贡献于2013-11-20

作者 Administor  创建于2012-12-04 03:27:00   修改者Administor  修改于2012-12-04 03:28:00字数2275

文档摘要: 今天介绍的Uploadify 3.2的,以前旧版本的并不适用,说到这个,我就火大,我也是第一次使用,也百度了下使用手册,结果坑爹的那些手册都是旧版的,新版的Uploadify接口和旧版的差太多了。废话不多说,进入正题。Uploadify下载地址: 这里下载最新版的3.2的。
关键词:

jQuery上传插件Uploadify 3.2使用       我今天介绍的Uploadify 3.2的,以前旧版本的并不适用,说到这个,我就火大,我也是第一次使用,也百度了下使用手册,结果坑爹的那些手册都是旧版的,新版的Uploadify接口和旧版的差太多了。废话不多说,进入正题。 Uploadify下载地址:http://www.uploadify.com/download/ 这里下载最新版的3.2的。 下载下来解压后估计里面很多文件,其实有用的也就一个jquery.uploadify.js和uploadify.swf这两个文件。当然啦,jQuery库那是必须的。 在你使用的项目中,把jquery.uploadify.js引入以后,用法和大多数JQ插件一样。同时也要记得引入swfobject.js这个插件,版本2.2以上的。使用方法例如: 1 2 3 4 5 6 7 8 $(function() {     $("#file_upload_1").uploadify({         height        : 30,         swf           : '/uploadify/uploadify.swf',         uploader      : '/uploadify/uploadify.php',         width         : 120     }); }); file_upload_1其实也就是一个容器ID,比如
,上面的只是简单的事例,下面我就把我在项目中做的发出来,每个都有解释: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 $(document).ready(function() {     $("#file_upload").uploadify({         //开启调试         'debug' : false,         //是否自动上传         'auto':false,         //超时时间         'successTimeout':99999,         //附带值         'formData':{             'userid':'用户id',             'username':'用户名',             'rnd':'加密密文'         },         //flash         'swf': "uploadify.swf",         //不执行默认的onSelect事件         'overrideEvents' : ['onDialogClose'],         //文件选择后的容器ID 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63         'queueID':'uploadfileQueue',         //服务器端脚本使用的文件对象的名称 $_FILES个['upload']         'fileObjName':'upload',         //上传处理程序         'uploader':'imageUpload.php',         //浏览按钮的背景图片路径         'buttonImage':'upbutton.gif',         //浏览按钮的宽度         'width':'100',         //浏览按钮的高度         'height':'32',         //expressInstall.swf文件的路径。         'expressInstall':'expressInstall.swf',         //在浏览窗口底部的文件类型下拉菜单中显示的文本         'fileTypeDesc':'支持的格式:',         //允许上传的文件后缀         'fileTypeExts':'*.jpg;*.jpge;*.gif;*.png',         //上传文件的大小限制         'fileSizeLimit':'3MB',         //上传数量         'queueSizeLimit' : 25,         //每次更新上载的文件的进展         'onUploadProgress' : function(file, bytesUploaded, bytesTotal, totalBytesUploaded, totalBytesTotal) {              //有时候上传进度什么想自己个性化控制,可以利用这个方法              //使用方法见官方说明         },         //选择上传文件后调用         'onSelect' : function(file) {                            },         //返回一个错误,选择文件的时候触发         'onSelectError':function(file, errorCode, errorMsg){             switch(errorCode) {                 case -100:                     alert("上传的文件数量已经超出系统限制的"+$('#file_upload').uploadify('settings','queueSizeLimit')+"个文件!");                     break;                 case -110:                     alert("文件 ["+file.name+"] 大小超出系统限制的"+$('#file_upload').uploadify('settings','fileSizeLimit')+"大小!");                     break;                 case -120: 64 65 66 67 68 69 70 71 72 73 74 75 76                     alert("文件 ["+file.name+"] 大小异常!");                     break;                 case -130:                     alert("文件 ["+file.name+"] 类型不正确!");                     break;             }         },         //检测FLASH失败调用         'onFallback':function(){             alert("您未安装FLASH控件,无法上传图片!请安装FLASH控件后再试。");         },         //上传到服务器,服务器返回相应信息到data里         'onUploadSuccess':function(file, data, response){             alert(data);         }     }); }); 大体上常用的我想也就这些,至于后端处理上传部分,我这里就不多讲了,和普通的文件上传处理方式是一样的。

下载文档到电脑,查找使用更方便

文档的实际排版效果,会与网站的显示效果略有不同!!

需要 2 金币 [ 分享文档获得金币 ] 0 人已下载

下载文档