多文件上传 file-uploader.js
2024-08-25 17:57:02
插件暴露给用户可以设置的参数
插件构成
声明一个全局对象qq,在对象上封装几个方法,类似JQUERY的方法
qq.extend 合并对象属性,类似$.extend()
qq.indexOf 获取元素索引
qq.getUniqueId
qq.ie--qq.safari--qq.chrome--qq.firefox--qq.windows
qq.attach 事件绑定
qq.detach 解除事件绑定
qq.preventDefault 组织浏览器磨人行为
qq.insertBefore 插入元素
qq.remove
qq.contains
qq.toElement
qq.css
qq.hasClass
qq.addClass
qq.removeClass
qq.setText
qq.children
qq.getByClass
qq.obj2url 组合请求地址
qq.FileUploaderBasic 基本属性和外接方法
qq.FileUploaderBasic.prototype---文件上传插件的原型
setParams
getInProgress
_createUploadButton--创建上传按钮,包括上传按钮属性,事件
_createUploadHandler--上传处理程序
_preventLeaveInProgress
_onSubmit
_onProgress
_onComplete
_onCancel
_onUpload
_onInputChange
_uploadFileList
_uploadFile
_validateFile--文件校验,格式,大小等
_formatFileName 限制名字长度
_isAllowedExtension
_formatSize 格式化输出图片大小
qq.FileUploader
qq.extend() 追加新的参数,包含上传按钮,图片列表模板等基本信息
qq.FileUploader
addExtraDropzon
removeExtraDropzone
_leaving_document_out
_find--从this._options.classes中获取元素,包含上传按钮和图片列表
_setupExtraDropzone
_setupDropzone
_setupDragDrop
_onSubmit--先执行option参数中的onSubmit如果返回false,不再继续执行,否则再执行FileUploaderBasic的_onSubmit函数
提交上传FileUploader.prototype._onSubmit,_addToList是添加列表项; 另外一提,qq.FileUploaderBasic.prototype._onSubmit.apply(this, arguments);首先执行插件暴露的onSubmit方法里的代码块,这里是你实例化插件时可以附加的(选填);
图片上传完成(complete)会接收一个JSON格式的响应,插件默认是使用{success:true/false}定义服务器端的响应,并且根据服务器端的响应,给上传列表添加是否上传成功的样式;可以在这个位置自定义服务器的返回格式;插件在上传完成以后默认是把加载效果spinner和取消上传按钮cancel移除DOM元素
_addToList--控制上传文件列表中的内容,一般是列表模板中定义的需要的文件相关信息,图片名称,大小
_getItemByFileId--获取当前列表项的DOM对象
__bindCancelEvent--定义取消上传按钮的事件,取消事件的类名是在_classes中定义的cancel 如果是自定义上传列表模板,需修改fileTemplate和classes,并且要一一对应,classes对象中的属性必须出现;(比较麻烦)
qq.UploadDropZone--定义拖拽构造函数
qq.UploadDropZone.prototype--拖拽原型
qq.UploadButton--定义上传按钮
qq.UploadButton.prototype
getInput
reset
_createInput--创建上传按钮,包含样式,属性和事件
qq.UploadHandlerAbstract--上传插件抽象函数,辅助函数
qq.UploadHandlerAbstract.prototype
log--日志
add
upload
qq.UploadHandlerXhr--异步上传
qq.UploadHandlerXhr.prototype--异步上传原型,包含异步上传的所有方法
add
getName
getSize
getLoaded
_upload--图片上传细节,创建XMLHttpRequest,监听status,设置请求头
_onComplete--在_upload中服务器响应后调用
_cancel--终止异步请求
现在这个插件项目已经迁移到fine-uploader项目上了,以后会对插件使用规范下一下文档
最新文章
- java中使用split分割字符串一个有趣的现象
- Fragment中监听onKey事件,没你想象的那么难。
- 埃氏筛法(快速筛选n以内素数的个数)
- backboneJs 导图
- Android SimpleAdapter GridView (网格图片点击放大显示)
- ubunut 查看port被哪个程序占用
- Android的ListView
- MinerConstanits.java 常量类
- ADO.NET之使用DataSet类更新数据库
- '新', '泽' - ImageMagick - UTF-8非最短形式及编码安全问题
- FTP(虚拟用户,并且每个虚拟用户可以具有独立的属性配置)
- ucml JS调用其它页面上的服务端方法
- (译)理解 LSTM 网络 (Understanding LSTM Networks by colah)
- ServiceStack DateTime数据类型转Json出现的困扰
- 用ViewPager实现一个程序引导界面
- ubuntu 安装 2.10.x版本的scala
- HDU 5887 Herbs Gathering(搜索求01背包)
- S11 day 93 RestFramework 之 序列化
- Structs2笔记③--局部类型转换案例
- java web 复选框checked
热门文章
- DEDE整站动态化或整站静态化设置方法,织梦栏目批量静态/动态方法
- Win10 Sql2008R2 在关闭【0x80041033】
- mysql 加锁测试
- 几个ES6新特性
- AppBox升级进行时 - Entity Framework的增删改查
- Android studio下使用SharedSDK
- 【Python】[模块]使用模块,安装第三方模块
- .Net Core Linux centos7行—安装nginx,运行静态网站
- I finally made sense of front end build tools. You can, too.
- python 中文乱码问题2