使用WebUploader实现文件批量上传,进度条显示功能
生活随笔
收集整理的這篇文章主要介紹了
使用WebUploader实现文件批量上传,进度条显示功能
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
知識(shí)點(diǎn):利用WebUploader,實(shí)現(xiàn)文件批量上傳,并且實(shí)時(shí)顯示文件的上傳進(jìn)度
參考官方文檔:http://fex.baidu.com/webuploader/
?? (1)引入三個(gè)資源 JS,CSS,SWF
webuploader.js,webuploader.css,Uploader.swf(2)初始化Web Uploader uploader = WebUploader.create({
// swf文件路徑
swf: '/static/swf/Uploader.swf',
// 文件接收服務(wù)端接口
server: '/screen/upload',
// 選擇文件的按鈕。可選。
// 內(nèi)部根據(jù)當(dāng)前運(yùn)行是創(chuàng)建,可能是input元素,也可能是flash.
pick: {
//picker為頁(yè)面上傳文件按鈕 div的id名稱(chēng)
id:'#picker',
//是否允許單次上傳時(shí)同時(shí)選擇多個(gè)文件
multiple:true
},
//[可選] [默認(rèn)值:undefined] 驗(yàn)證文件總數(shù)量, 超出則不允許加入隊(duì)列。
//上傳文件總數(shù)限制
fileNumLimit: 20,
//fileSingleSizeLimit {int} [可選] [默認(rèn)值:undefined] 驗(yàn)證單個(gè)文件大小是否超出限制, 超出則不允許加入隊(duì)列
//上傳的單個(gè)文件大小限制
//500M,暫時(shí)針對(duì)視頻(字節(jié)為單位)
fileSingleSizeLimit:500*1024*1024,
method:'POST',
//允許上傳文件的類(lèi)型
accept: {
title: 'file',
extensions: 'jpg,bmp,png,mp4,flv'
},
// 不壓縮image, 默認(rèn)如果是jpeg,文件上傳前會(huì)壓縮一把再上傳!
resize: false,
//可否可以重復(fù)上傳相同文件(如果為true,則相同文件可以重復(fù)上傳)
duplicate: true
});
(3)上傳進(jìn)度,成功失敗事件,可參考官方demo,或者本人demo,在原基礎(chǔ)上修改
?
轉(zhuǎn)載于:https://www.cnblogs.com/shuaifing/p/9579159.html
總結(jié)
以上是生活随笔為你收集整理的使用WebUploader实现文件批量上传,进度条显示功能的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: MySql+Socket 完成数据库的增
- 下一篇: Slog45_项目上线之域名的购买