seo网站优化师,wordpress+商场源码,永城城乡建设局网站,电子商务网站建设前的分析相信有不少同学用过uploadify这一款文件上传插件#xff0c;它支持多文件选择、能显示进度条、可配置性高#xff0c;总体来说是比较好用的。官网有两个版本供下载#xff0c;分别是flash版和HTML5版。不过令人惋惜的是#xff0c;HTML5版是收费的。活了这么多年#xff0…相信有不少同学用过uploadify这一款文件上传插件它支持多文件选择、能显示进度条、可配置性高总体来说是比较好用的。官网有两个版本供下载分别是flash版和HTML5版。不过令人惋惜的是HTML5版是收费的。活了这么多年啥时候用软件掏过钱啊秉着发扬我们的优良传统我决定照着它的API自己实现一个HTML5版的。经过一番折腾终于覆盖了大部分API已经能够实现基本的文件上传需求。如下是插件中的default配置复制代码var defaults {fileTypeExts:,//允许上传的文件类型格式*.jpg;*.docuploader:,//文件提交的地址auto:false,//是否开启自动上传method:post,//发送请求的方式get或postmulti:true,//是否允许选择多个文件formData:null,//发送给服务端的参数格式{key1:value1,key2:value2}fileObjName:file,//在后端接受文件的参数名称如PHP中的$_FILES[file]fileSizeLimit:2048,//允许上传的文件大小单位KBshowUploadedPercent:true,//是否实时显示上传的百分比如20%showUploadedSize:false,//是否实时显示已上传的文件大小如1M/2MbuttonText:选择文件,//上传按钮上的文字removeTimeout: 1000,//上传完成后进度条的消失时间单位毫秒itemTemplate:itemTemp,//上传队列显示的模板onUploadStart:null,//上传开始时的动作onUploadSuccess:null,//上传成功的动作onUploadComplete:null,//上传完成的动作onUploadError:null, //上传失败的动作onInit:null,//初始化时的动作onCancel:null//删除掉某个文件后的回调函数可传入参数file}复制代码已实现的特性有多文件上传显示进度条显示已上传文件大小和百分比文件后缀名和文件大小检测向服务端提交额外数据自定义文件队列中的html模板css样式分离出单独文件可自己定制样式添加文件上传各阶段的回调函数使用方式首先页面上需要一个容器通常是一个p如然后直接调用即可复制代码$(#upload).Huploadify({auto:true,fileTypeExts:*.jpg;*.png;*.exe,multi:true,formData:{key:123456,key2:vvvv},fileSizeLimit:1024,showUploadedPercent:true,showUploadedSize:true,removeTimeout:9999999,uploader:upload.php,onUploadStart:function(){console.log(开始上传);},onInit:function(){console.log(初始化);},onUploadComplete:function(){console.log(上传完成);},onCancel:function(file){console.log(file);}});
