//多文件上传 FileUpload //前置插件jquery,webuploader(百度上传) //用法:new FileUpload({...}) //author:guye //createdate: 2019/1/8 (function (global, $, WebUploader, factory) { typeof exports == "object" && typeof module != "undefined" ? module.exports = factory() : typeof define === 'function' && define.amd ? define(factory) : (global.FileUpload = factory()); })(this, jQuery, WebUploader, function () { var FileUpload = function (options) { //构造函数 if (!(this instanceof FileUpload)) { console.log("FileUpload 是一个构造函数,应该用new关键字调用"); return; } //默认配置参数 var _DEFALUTS_ = { serverPath: '', //上传路径 pick: { id: "#picker", //指定选择文件的按钮容器,不指定则不创建按钮。id {Seletor|dom} 指定选择文件的按钮容器,不指定则不创建按钮。注意 这里虽然写的是 id, 但是不是只支持 id, 还支持 class, 或者 dom 节点。 multiple: true, //是否开起同时选择多个文件能力。 innerHTML: "", //指定按钮文字。不指定时优先从指定的容器中看是否自带文字。 }, timeout: 0, startUploadBtnId: '#startBtn', //开始上传 auto: false, // [默认值:false] 设置为 true 后,不需要手动调用上传,有文件选择即开始上传。 method: 'POST', // {Object} [可选] [默认值:'POST'] 文件上传方式,POST或者GET。 sendAsBinary: false, // {Object} [可选] [默认值:false] 是否已二进制的流的方式发送文件,这样整个上传内容php://input都为文件内容, 其他参数在$_GET数组中。 compress: false, //不启用压缩 resize: false, //不压缩image, 默认如果是jpeg,文件上传前会压缩一把再上传!默认如果是jpeg,文件上传前会压缩一把再上传! formData: {}, //上传的自定义参数 fileSingleSizeLimit: 1024 * 1024 * 1024, //默认单个附件限制1G fileSizeLimit: 10 * 1024 * 1024 * 1024, //默认总附件限制10G accept: { title: 'Files', extensions: '*' }, uploadSuccess: function (file, response) { }, fileQueued: function (file) { }, beforeAddQueue: function (file) { }, uploadProgress: function (file, percentage) { }, uploadError: function (file, reason) { }, uploadBeforeError: function (file, reason) { }, uploadComplete: function (file) { }, all: function (type) { //on还可以用来添加一个特殊事件all, 这样所有的事件触发都会响应到。同时此类callback中的arguments有一个不同处, 就是第一个参数为type,记录当前是什么事件在触发。此类callback的优先级比脚低,会再正常callback执行完后触发。 } } $.extend(_DEFALUTS_, options || {}); var $btn = $(_DEFALUTS_.startUploadBtnId); var state = 'pending'; // 实例化 var uploader = WebUploader.create({ // swf文件路径 swf: 'static/plugins/ptfileupload/Uploader.swf', // 文件接收服务端。 server: _DEFALUTS_.serverPath, // 选择文件的按钮。可选。 // 内部根据当前运行是创建,可能是input元素,也可能是flash. pick: _DEFALUTS_.pick, timeout: 0, method: _DEFALUTS_.method, // 不压缩image, 默认如果是jpeg,文件上传前会压缩一把再上传! compress: _DEFALUTS_.compress, //不启用压缩 resize: _DEFALUTS_.resize, formData: _DEFALUTS_.formData, fileSingleSizeLimit: _DEFALUTS_.fileSingleSizeLimit, fileSizeLimit: _DEFALUTS_.fileSizeLimit, accept: _DEFALUTS_.accept, auto: _DEFALUTS_.auto, sendAsBinary: _DEFALUTS_.sendAsBinary }); uploader.on('beforeFileQueued', function (file) { return _DEFALUTS_.beforeAddQueue && _DEFALUTS_.beforeAddQueue(file); }); uploader.on('fileQueued', function (file) { _DEFALUTS_.fileQueued && _DEFALUTS_.fileQueued(file); }); uploader.on('uploadProgress', function (file, percentage) { _DEFALUTS_.uploadProgress && _DEFALUTS_.uploadProgress(file, percentage); }); uploader.on('uploadSuccess', function (file, response) { _DEFALUTS_.uploadSuccess && _DEFALUTS_.uploadSuccess(file, response); }); uploader.on('uploadError', function (file, reason) { _DEFALUTS_.uploadError && _DEFALUTS_.uploadError(file, reason); }); uploader.on('error', function (type) { _DEFALUTS_.uploadBeforeError && _DEFALUTS_.uploadBeforeError(type); }); uploader.on('uploadComplete', function (file) { _DEFALUTS_.uploadComplete && _DEFALUTS_.uploadComplete(file); }); $btn && $btn.on('click', function () { if (state === 'uploading') { uploader.stop(); } else { uploader.upload(); } }); } return FileUpload; });