uploadify 3.0 詳細(xì)使用說(shuō)明
更新時(shí)間:2012年06月18日 14:23:26 作者:
uploadify 3.0 詳細(xì)使用說(shuō)明,需要的朋友可以參考下
使用:
//綁定的界面元素<input id='gallery'type='file'/>
$("#gallery").uploadify({
設(shè)置參數(shù),參數(shù)如下.
});
設(shè)置的屬性:
id: jQuery(this).attr('id'),//綁定的input的ID
langFile: 'http://www.static-xxx.nu/uploader/uploadifyLang_en.js',//語(yǔ)言包的路徑,能設(shè)置所有的提示文字
swf: 'http://www.static-xxx.nu/uploader/uploadify.swf',//[必須設(shè)置]swf的路徑
uploader: '/uploadify/galleri.php',//[必須設(shè)置]上傳文件觸發(fā)的url
auto:false,//文件選擇完成后,是否自動(dòng)上傳
buttonText:'Välj Filer',//上傳按鈕的文字
height: 30,//上傳按鈕的高和寬
width: 120,
buttonCursor: 'pointer',//上傳鼠標(biāo)hover后Cursor的形狀
cancelImage: '/upload/201206/20120618142325932.png',//[必須設(shè)置]取消圖片的路徑
checkExisting:'/uploader/uploadify-check-existing.php',//檢查上傳文件是否存,觸發(fā)的url,返回1/0
debug: true,//debug模式開(kāi)/關(guān),打開(kāi)后會(huì)顯示debug時(shí)的信息
fileObjName:'file',
fileSizeLimit : 0,//文件的極限大小,以字節(jié)為單位,0為不限制。1MB:1*1024*1024
fileTypeDesc: 'Bild JPG',//允許上傳的文件類型的描述,在彈出的文件選擇框里會(huì)顯示
fileTypeExts: '*.jpg',//允許上傳的文件類型,限制彈出文件選擇框里能選擇的文件
method: 'post',//和后臺(tái)交互的方式:post/get
multi: true,//是否能選擇多個(gè)文件
queueID: 'fileQueue',//顯示上傳文件隊(duì)列的元素id,可以簡(jiǎn)單用一個(gè)div來(lái)顯示
queueSizeLimit : 999,//隊(duì)列中允許的最大文件數(shù)目
progressData : 'all', // 'percentage''speed''all'//隊(duì)列中顯示文件上傳進(jìn)度的方式:all-上傳速度+百分比,percentage-百分比,speed-上傳速度
removeCompleted : true,//上傳成功后的文件,是否在隊(duì)列中自動(dòng)刪除
removeTimeout: 3,
requeueErrors : true,
postData: {},//和后臺(tái)交互時(shí),附加的參數(shù)
preventCaching : true,
transparent: true,
successTimeout : 30,//上傳時(shí)的timeout
uploadLimit:999//能同時(shí)上傳的文件數(shù)目
設(shè)置的事件:
onDialogClose : function(swfuploadifyQueue) {//當(dāng)文件選擇對(duì)話框關(guān)閉時(shí)觸發(fā)
if( swfuploadifyQueue.filesErrored > 0 ){
alert( '添加至隊(duì)列時(shí)有'
+swfuploadifyQueue.filesErrored
+'個(gè)文件發(fā)生錯(cuò)誤n'
+'錯(cuò)誤信息:'
+swfuploadifyQueue.errorMsg
+'n選定的文件數(shù):'
+swfuploadifyQueue.filesSelected
+'n成功添加至隊(duì)列的文件數(shù):'
+swfuploadifyQueue.filesQueued
+'n隊(duì)列中的總文件數(shù)量:'
+swfuploadifyQueue.queueLength);
}
}
onDialogOpen : function() {//當(dāng)選擇文件對(duì)話框打開(kāi)時(shí)觸發(fā)
alert( 'Open!');
}
onSelect : function(file) {//當(dāng)每個(gè)文件添加至隊(duì)列后觸發(fā)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus);
}
onSelectError : function(file,errorCode,errorMsg) {//當(dāng)文件選定發(fā)生錯(cuò)誤時(shí)觸發(fā)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 錯(cuò)誤代碼: ' + errorCode
+ ' - 錯(cuò)誤信息: ' + errorMsg);
}
onQueueComplete : function(stats) {//當(dāng)隊(duì)列中的所有文件全部完成上傳時(shí)觸發(fā)
alert( '成功上傳的文件數(shù): ' + stats.successful_uploads
+ ' - 上傳出錯(cuò)的文件數(shù): ' + stats.upload_errors
+ ' - 取消上傳的文件數(shù): ' + stats.upload_cancelled
+ ' - 出錯(cuò)的文件數(shù)' + stats.queue_errors);
}
onUploadComplete : function(file,swfuploadifyQueue) {//隊(duì)列中的每個(gè)文件上傳完成時(shí)觸發(fā)一次
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 出錯(cuò)的文件數(shù): ' + swfuploadifyQueue.filesErrored
+ ' - 錯(cuò)誤信息: ' + swfuploadifyQueue.errorMsg
+ ' - 要添加至隊(duì)列的數(shù)量: ' + swfuploadifyQueue.filesSelected
+ ' - 添加至對(duì)立的數(shù)量: ' + swfuploadifyQueue.filesQueued
+ ' - 隊(duì)列長(zhǎng)度: ' + swfuploadifyQueue.queueLength);
}
onUploadError : function(file,errorCode,errorMsg,errorString,swfuploadifyQueue) {//上傳文件出錯(cuò)是觸發(fā)(每個(gè)出錯(cuò)文件觸發(fā)一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 錯(cuò)誤代碼: ' + errorCode
+ ' - 錯(cuò)誤描述: ' + errorMsg
+ ' - 簡(jiǎn)要錯(cuò)誤描述: ' + errorString
+ ' - 出錯(cuò)的文件數(shù): ' + swfuploadifyQueue.filesErrored
+ ' - 錯(cuò)誤信息: ' + swfuploadifyQueue.errorMsg
+ ' - 要添加至隊(duì)列的數(shù)量: ' + swfuploadifyQueue.filesSelected
+ ' - 添加至對(duì)立的數(shù)量: ' + swfuploadifyQueue.filesQueued
+ ' - 隊(duì)列長(zhǎng)度: ' + swfuploadifyQueue.queueLength);
}
onUploadProgress : function(file,fileBytesLoaded,fileTotalBytes,
queueBytesLoaded,swfuploadifyQueueUploadSize) {//上傳進(jìn)度發(fā)生變更時(shí)觸發(fā)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 當(dāng)前文件已上傳: ' + fileBytesLoaded
+ ' - 當(dāng)前文件大小: ' + fileTotalBytes
+ ' - 隊(duì)列已上傳: ' + queueBytesLoaded
+ ' - 隊(duì)列大小: ' + swfuploadifyQueueUploadSize);
}
onUploadStart: function(file) {//上傳開(kāi)始時(shí)觸發(fā)(每個(gè)文件觸發(fā)一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus );
}
onUploadSuccess : function(file,data,response) {//上傳完成時(shí)觸發(fā)(每個(gè)文件觸發(fā)一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 服務(wù)器端消息: ' + data
+ ' - 是否上傳成功: ' + response);
}
復(fù)制代碼 代碼如下:
//綁定的界面元素<input id='gallery'type='file'/>
$("#gallery").uploadify({
設(shè)置參數(shù),參數(shù)如下.
});
設(shè)置的屬性:
復(fù)制代碼 代碼如下:
id: jQuery(this).attr('id'),//綁定的input的ID
langFile: 'http://www.static-xxx.nu/uploader/uploadifyLang_en.js',//語(yǔ)言包的路徑,能設(shè)置所有的提示文字
swf: 'http://www.static-xxx.nu/uploader/uploadify.swf',//[必須設(shè)置]swf的路徑
uploader: '/uploadify/galleri.php',//[必須設(shè)置]上傳文件觸發(fā)的url
auto:false,//文件選擇完成后,是否自動(dòng)上傳
buttonText:'Välj Filer',//上傳按鈕的文字
height: 30,//上傳按鈕的高和寬
width: 120,
buttonCursor: 'pointer',//上傳鼠標(biāo)hover后Cursor的形狀
cancelImage: '/upload/201206/20120618142325932.png',//[必須設(shè)置]取消圖片的路徑
checkExisting:'/uploader/uploadify-check-existing.php',//檢查上傳文件是否存,觸發(fā)的url,返回1/0
debug: true,//debug模式開(kāi)/關(guān),打開(kāi)后會(huì)顯示debug時(shí)的信息
fileObjName:'file',
fileSizeLimit : 0,//文件的極限大小,以字節(jié)為單位,0為不限制。1MB:1*1024*1024
fileTypeDesc: 'Bild JPG',//允許上傳的文件類型的描述,在彈出的文件選擇框里會(huì)顯示
fileTypeExts: '*.jpg',//允許上傳的文件類型,限制彈出文件選擇框里能選擇的文件
method: 'post',//和后臺(tái)交互的方式:post/get
multi: true,//是否能選擇多個(gè)文件
queueID: 'fileQueue',//顯示上傳文件隊(duì)列的元素id,可以簡(jiǎn)單用一個(gè)div來(lái)顯示
queueSizeLimit : 999,//隊(duì)列中允許的最大文件數(shù)目
progressData : 'all', // 'percentage''speed''all'//隊(duì)列中顯示文件上傳進(jìn)度的方式:all-上傳速度+百分比,percentage-百分比,speed-上傳速度
removeCompleted : true,//上傳成功后的文件,是否在隊(duì)列中自動(dòng)刪除
removeTimeout: 3,
requeueErrors : true,
postData: {},//和后臺(tái)交互時(shí),附加的參數(shù)
preventCaching : true,
transparent: true,
successTimeout : 30,//上傳時(shí)的timeout
uploadLimit:999//能同時(shí)上傳的文件數(shù)目
設(shè)置的事件:
復(fù)制代碼 代碼如下:
onDialogClose : function(swfuploadifyQueue) {//當(dāng)文件選擇對(duì)話框關(guān)閉時(shí)觸發(fā)
if( swfuploadifyQueue.filesErrored > 0 ){
alert( '添加至隊(duì)列時(shí)有'
+swfuploadifyQueue.filesErrored
+'個(gè)文件發(fā)生錯(cuò)誤n'
+'錯(cuò)誤信息:'
+swfuploadifyQueue.errorMsg
+'n選定的文件數(shù):'
+swfuploadifyQueue.filesSelected
+'n成功添加至隊(duì)列的文件數(shù):'
+swfuploadifyQueue.filesQueued
+'n隊(duì)列中的總文件數(shù)量:'
+swfuploadifyQueue.queueLength);
}
}
onDialogOpen : function() {//當(dāng)選擇文件對(duì)話框打開(kāi)時(shí)觸發(fā)
alert( 'Open!');
}
onSelect : function(file) {//當(dāng)每個(gè)文件添加至隊(duì)列后觸發(fā)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus);
}
onSelectError : function(file,errorCode,errorMsg) {//當(dāng)文件選定發(fā)生錯(cuò)誤時(shí)觸發(fā)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 錯(cuò)誤代碼: ' + errorCode
+ ' - 錯(cuò)誤信息: ' + errorMsg);
}
onQueueComplete : function(stats) {//當(dāng)隊(duì)列中的所有文件全部完成上傳時(shí)觸發(fā)
alert( '成功上傳的文件數(shù): ' + stats.successful_uploads
+ ' - 上傳出錯(cuò)的文件數(shù): ' + stats.upload_errors
+ ' - 取消上傳的文件數(shù): ' + stats.upload_cancelled
+ ' - 出錯(cuò)的文件數(shù)' + stats.queue_errors);
}
onUploadComplete : function(file,swfuploadifyQueue) {//隊(duì)列中的每個(gè)文件上傳完成時(shí)觸發(fā)一次
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 出錯(cuò)的文件數(shù): ' + swfuploadifyQueue.filesErrored
+ ' - 錯(cuò)誤信息: ' + swfuploadifyQueue.errorMsg
+ ' - 要添加至隊(duì)列的數(shù)量: ' + swfuploadifyQueue.filesSelected
+ ' - 添加至對(duì)立的數(shù)量: ' + swfuploadifyQueue.filesQueued
+ ' - 隊(duì)列長(zhǎng)度: ' + swfuploadifyQueue.queueLength);
}
onUploadError : function(file,errorCode,errorMsg,errorString,swfuploadifyQueue) {//上傳文件出錯(cuò)是觸發(fā)(每個(gè)出錯(cuò)文件觸發(fā)一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 錯(cuò)誤代碼: ' + errorCode
+ ' - 錯(cuò)誤描述: ' + errorMsg
+ ' - 簡(jiǎn)要錯(cuò)誤描述: ' + errorString
+ ' - 出錯(cuò)的文件數(shù): ' + swfuploadifyQueue.filesErrored
+ ' - 錯(cuò)誤信息: ' + swfuploadifyQueue.errorMsg
+ ' - 要添加至隊(duì)列的數(shù)量: ' + swfuploadifyQueue.filesSelected
+ ' - 添加至對(duì)立的數(shù)量: ' + swfuploadifyQueue.filesQueued
+ ' - 隊(duì)列長(zhǎng)度: ' + swfuploadifyQueue.queueLength);
}
onUploadProgress : function(file,fileBytesLoaded,fileTotalBytes,
queueBytesLoaded,swfuploadifyQueueUploadSize) {//上傳進(jìn)度發(fā)生變更時(shí)觸發(fā)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 當(dāng)前文件已上傳: ' + fileBytesLoaded
+ ' - 當(dāng)前文件大小: ' + fileTotalBytes
+ ' - 隊(duì)列已上傳: ' + queueBytesLoaded
+ ' - 隊(duì)列大小: ' + swfuploadifyQueueUploadSize);
}
onUploadStart: function(file) {//上傳開(kāi)始時(shí)觸發(fā)(每個(gè)文件觸發(fā)一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus );
}
onUploadSuccess : function(file,data,response) {//上傳完成時(shí)觸發(fā)(每個(gè)文件觸發(fā)一次)
alert( 'id: ' + file.id
+ ' - 索引: ' + file.index
+ ' - 文件名: ' + file.name
+ ' - 文件大小: ' + file.size
+ ' - 類型: ' + file.type
+ ' - 創(chuàng)建日期: ' + file.creationdate
+ ' - 修改日期: ' + file.modificationdate
+ ' - 文件狀態(tài): ' + file.filestatus
+ ' - 服務(wù)器端消息: ' + data
+ ' - 是否上傳成功: ' + response);
}
相關(guān)文章
使用jQuery制作遮罩層彈出效果的極簡(jiǎn)實(shí)例分享
這篇文章主要介紹了使用jQuery制作遮罩層彈出效果的極簡(jiǎn)實(shí)例分享,效果中背景為半透冥且不可操作,在制作頁(yè)面上傳功能等場(chǎng)景下十分實(shí)用,需要的朋友可以參考下2016-05-05
jQuery實(shí)現(xiàn)的手動(dòng)拖動(dòng)控制進(jìn)度條效果示例【測(cè)試可用】
這篇文章主要介紹了jQuery實(shí)現(xiàn)的手動(dòng)拖動(dòng)控制進(jìn)度條效果,涉及jQuery事件響應(yīng)及頁(yè)面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-04-04
淺析jquery數(shù)組刪除指定元素的方法:grep()
下面小編就為大家?guī)?lái)一篇淺析jquery數(shù)組刪除指定元素的方法:grep()。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
手寫(xiě)簡(jiǎn)單的jQuery雪花飄落效果實(shí)例
這篇文章主要給大家介紹了關(guān)于手寫(xiě)簡(jiǎn)單的jQuery雪花飄落的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧。2018-04-04
完美兼容各大瀏覽器的jQuery插件實(shí)現(xiàn)圖片切換特效
網(wǎng)友zoeDylan寫(xiě)的原創(chuàng)jquery插件,實(shí)現(xiàn)了圖片輪播功能,jquery插件名稱為zoeDylan.ImgChange,圖片路徑、跳轉(zhuǎn)鏈接、提示標(biāo)題都是有動(dòng)態(tài)數(shù)組來(lái)配置,jquery插件可靈活配置6個(gè)參數(shù), height高、width寬、mgs圖片地址、links點(diǎn)擊地址、tips圖片說(shuō)明、timers自動(dòng)切換時(shí)間,2014-12-12
JQuery實(shí)現(xiàn)的圖文自動(dòng)輪播效果插件
這篇文章主要介紹了JQuery實(shí)現(xiàn)的圖文自動(dòng)輪播效果插件,涉及jQuery處理鼠標(biāo)事件及動(dòng)畫(huà)效果的方法,需要的朋友可以參考下2015-06-06
使用jQuery在對(duì)象中緩存選擇器的簡(jiǎn)單方法
這篇文章主要介紹了使用jQuery在對(duì)象中緩存選擇器的簡(jiǎn)單方法,jQuery是最知名的JavaScript庫(kù),需要的朋友可以參考下2015-06-06

