jquery.uploadify上傳插件HTML5版中文api使用說明

插件官網文檔:http://www.uploadify.com/documentation/?

uploadify分為Flash版和HTML5版,其中Flash版是免費的,H5版是收費的,這里介紹的是收費的H5版


首先引用外部資源,jquery.min.js,jquery.uploadifive.min.js或jquery.uploadifive.js和uploadifive.css

$('#file_upload').uploadifive({

'auto':false,//設置auto為true,當文件被添加至上傳隊列時,將會自動上傳

'buttonClass':'btn',//為上傳按鈕添加類名

'buttonText':'選擇圖片',//定義顯示在默認按鈕上的文本

'dnd':true,//如果設置為 false , 拖放功能將不被啟用

'fileObjName':'11',//定義上傳數據處理文件中接收數據使用的文件對象名

'fileSizeLimit':1000,//上傳文件大小限制,單位KB

'fileType':'image',//允許上傳的文件類型

//'checkScript': 'check-exists.php',//定義檢查目標文件夾中是否存在同名文件的腳本文件路徑

//'formData': {

//? ? 'timestamp': '',

//? ? 'token': ''

//},//定義在文件上傳時需要一同提交的其他數據對象

'height':20,//上傳按鈕的高度(單位:像素)

'width':100,//上傳按鈕的寬度(單位:像素)

// 'itemTemplate' : '',//指定上傳隊列的HTML

'method':'post',//上傳文件的提交方法,取值‘post‘或‘get‘。

'multi':true,//設置值為false時,一次只能選中一個文件

//'overrideEvents':['onProgress'],//該項定義了一組默認腳本中你不想執行的事件名稱

'queueSizeLimit':12,//上傳隊列中一次可容納的最大條數

'removeCompleted':true,//不設置該選項或者將其設置為false,將使上傳隊列中的項目始終顯示于隊列中,直到點擊了關閉按鈕或者隊列被清空

//? 'simUploadLimit': 10,//所述多個文件同時上傳 , 可以在任何給定時間

'truncateLength':1,//截斷文件名字符

'uploadLimit':2,//定義允許的最大上傳數量

'queueID':'queue',//queueID選項允許你設置一個擁有唯一ID的DOM元素來作為顯示上傳隊列的容器

'uploadScript':'up.ashx',//服務器處理腳本的路徑

'onUploadComplete':function(file, data) {

//

},//每一個文件上傳完成都會觸發該事件,不管是上傳成功還是上傳失敗

//'onAddQueueItem':function(file) {

//? // alert('The file ' + file.type + ' was added to the queue!');

//},//將一個新文件添加到上傳隊列時觸發

//'onCancel': function () {

//? ? alert('The file ' + file.name + ' was cancelled!');

//},//設置onCancel選項,在文件上傳被取消時,將允許運行一個自定義函數

//'onCheck': function (file, exists) {

//? ? if (exists) {

//? ? ? ? alert('The file ' + file.name + ' exists on the server.');

//? ? }

//},//當檢測該文件已存在時執行

//'onClearQueue': function (queue) {

//? ? queue.css('border', '2px solid #F00');

//},//設置onClearQueue選項,上傳隊列清空(激活ancel方法)時,將允許運行一個自定義函數

//'onDestroy': function () {

//? ? alert('Oh noes!? you destroyed UploadiFive!');

//},//銷毀Uploadify實例(調用destroy方法)時觸發該事件

//'onDrop': function (file, fileDropCount) {

//? ? alert(fileDropCount + ' files were dropped onto the queue.');

//},//當文件被放到該隊列文件

//'onError': function (errorType) {

//? ? alert('The error was: ' + errorType);

//},//選擇文件發生錯誤時執行

//'onFallback': function () {

//? ? alert('Oops!? You have to use the non-HTML5 file uploader.');

//},//瀏覽器檢測不到兼容時觸發該事件

//'onInit': function () {

//? ? alert('Add files to the queue to start uploading.');

//},//調用Uploadify初始化結束時觸發該事件

//'onProgress': function (file, e) {

//? ? if (e.lengthComputable) {

//? ? ? ? var percent = Math.round((e.loaded / e.total) * 100);

//? ? }

//? ? file.queueItem.find('.fileinfo').html(' - ' + percent + '%');

//? ? file.queueItem.find('.progress-bar').css('width', percent + '%');

//},//上傳進度更新時觸發該事件

//'onQueueComplete': function (uploads) {

//? ? alert(uploads.successful + ' files were uploaded successfully.');

//},//隊列中的所有文件被處理完成時觸發該事件

//'onSelect': function (queue) {

//? ? alert(queue.queued + ' files were added to the queue.');

//},//每添加一個文件至上傳隊列時觸發該事件

//'onUpload': function (filesToUpload) {

//? ? alert(filesToUpload + ' faddfd.');

//},//上傳操作時觸發

//'onUploadComplete': function (file, data) {

//? ? alert('The file ' + file.name + ' uploaded successfully.');

//},//每一個文件上傳完成都會觸發該事件,不管是上傳成功還是上傳失敗

'onUploadFile':function(file) {

alert('The file '+file.name+' is being uploaded.');

},//開始上傳時觸發

});

uploadify分為Flash版和HTML5版,其中Flash版是免費的,H5版是收費的,這里介紹的是收費的H5版

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容