Plupload 上傳插件 使用指南 (二)jquery

項目中用到改上傳插件,所以抽了一夜事件把列子和文檔看了一下,翻譯過來,若有錯誤的翻譯請幫助我一塊兒糾正謝謝。 javascript

介紹:php

Plupload是有TinyMCE的開發者開發的,爲您的內容管理系統或是相似上傳程序提供一個高度可用的上傳插件。Plupload 目前分爲一個核心API 和一個jQuery上傳隊列部件,這樣使你能夠直接使用或是本身定製。html

特性:html5

   

註釋:1gearshttp://zh.wikipedia.org/wiki/Gearsjava

           2、Silverlight:http://zh.wikipedia.org/wiki/Silverlightjquery

           3browserplus: http://developer.yahoo.com/browserplus/ web

注意:1、分塊:chromefirefox 4+ 支持。chrome

          2、拖拽適用於firefoxwebkit內核的瀏覽器,windows版的safari還存在一些問題待解決。windows

          3、圖片縮放僅在firefox3.5+chrome上支持,safari/opera 不支持直接數據訪問選定的文件。api

          4、目前全部的瀏覽器不支持文件類型過濾。可是,咱們填寫HTML5的接受文件類型過濾屬性,一旦有支持它會工做。 

         5、 多文件上傳僅支持geckowebkit內核的瀏覽器。

 

配置文檔說明:

Browse_button:觸發瀏覽文件按鈕標籤的惟一id,,flashhtml5、和silverlight中能找到觸發事件的源(我理解的,這個參數在隊列部件不須要參見      

Container: 展示上傳文件列表的容器,[默認是body]

chunk_size:當上傳文件大於服務器接收端文件大小限制的時候,能夠分屢次請求發給服務器,若是不須要從設置中移出

drop_element:當瀏覽器支持拖拽的狀況下,可以文件拖放到你想要的容器ID裏

file_data_name:設置上傳字段的名稱。默認狀況下被設置爲文件。(我試驗了沒找到該如何使用它,暫且不提)

filters:選擇文件擴展名的過濾器,每一個過濾規則中只有title和ext兩項[{title:'', extensions:''}]

flash_swf_url:flash文件地址

headers:自定義的插入http請求的鍵值對

max_file_size:最大上傳文件大小(格式100b, 10kb, 10mb, 1gb)

multipart:布爾值,若是用mutlipart 代替二進制流的方式,在webkit下沒法工做

multipart_params: 跟 multipart關聯在一塊兒的鍵值對

multi_selection: 多選對話框

resize:修改圖片屬性 resize: {width: 320, height: 240, quality: 90}

runtimes:上傳插件初始化選用那種方式的優先級順序,若是第一個初始化失敗就走第二個,依次類推

required_features:須要那些特性,才能初始化插件

url:上傳服務器地址

unique_names:是否生成惟一的文件名,避免與服務器文件重名

urlstream_upload:布爾值 若是是flash上傳應該用URLStream 代替FileReference.upload

      jquery部件的屬性:

dragdrop:是否支持拖拽,默認值true

multiple_queues:是否能夠屢次上傳

preinit:插件初始化前回調函數

rename:布爾值,上傳以前能夠重命名文件,默認false,木有找到如何重命名啊

 

    API文檔:

       方法列表:

  Uploader(setting):建立實例的構造方法

var uploader = new plupload.Uploader({
     runtimes : 'gears,html5,flash' ,
     browse_button : 'button_id'
});

  bind(event, function[, scope]):綁定事件

uploader.bind( 'Init' , function (up) {
     alert( 'Supports drag/drop: ' + (!!up.features.dragdrop));
});

  destroy():銷燬plupload的實例對象

uploader.destroy()

  getFile(id): 獲取上傳文件信息     

uploader.bind( 'FilesAdded' , function (up, files) {
     for ( var i in files) {
         up.getFile(files[i].id);      
     }
});<span style= "color: #ff0000; font-size: 13px;" > </span>

注:file:{
  id:文件編號,
  loaded: 已經上傳多少字節,
  name: 文件名,
  percent: 上傳進度,
  size: 文件大小,
  status: 有四種狀態 QUEUED, UPLOADING, FAILED, DONE.對應數值
}

init:初始化plupload實例,添加監聽對象

uploader.destroy()

  refresh:從新實例化uploader

     removeFile(id):從file中移除某個文件

  splice(start,length):從隊列中start開始刪除length個文件, 返回被刪除的文件列表

  start() 開始上傳

       stop()中止上傳

  unbind(name, function): 接觸事件綁定

  unbindAll()解綁全部事件

 屬性集合:

      features:uploader中包含那些特性

      files:當前隊列中的文件列表

      id:uploader實例的惟一id

      runtime:當前運行環境(是html五、flash等等)

      state:當前上傳進度狀態

      total:當前上傳文件的信息集合

    事件集合:(up爲uploader縮寫)

BeforeUpload(up, file):文件上傳完以前觸發的事件

ChunkUploaded(up, file,response)文件被分塊上傳的事件

Destroy(up):uploader的destroy調用的方法

Error(up, err):上傳出錯的時候觸發

Fileadded(up, files):用戶選擇文件時觸發

FileRemoved(up, files):當文件從上傳隊列中移除觸發

FileUploaded(up, file, res):文件上傳成功的時候觸發

Init(up):當初始化的時候觸發

PostInit(up):init執行完之後要執行的事件觸發

QueueChanged(up):當文件隊列變化時觸發

Refresh(up):當silverlight/flash或是其餘運行環境須要移動的時候觸發

StateChanged(up)當整個上傳隊列被改變的時候觸發

UploadComplete(up,file)當隊列中全部文件被上傳完時觸發

UploadFile(up,file)當一個文件被上傳的時候觸發

UploadProgress(up,file):當文件正在被上傳中觸發

 

轉載http://www.cnblogs.com/God-Shell/articles/3209708.html

相關文章
相關標籤/搜索