檔案上傳控制項PlupLoad 的使用

2021-07-30 07:14:12 字數 814 閱讀 7067

最近有用到乙個plupload 的檔案上傳控制項,覺得還不錯,但是找了很久網上也沒有具體的使用方法或者說是很詳細的使用方法,於是自己在完成功能之後就打算把這些方法給記錄下來,以便後面需要使用的時候方便檢視。以下簡單介紹下這個上傳控制項。

現在隨著html5技術的逐漸推廣和普及,再去使用以flash為上傳手段的swfupload顯然就有點過時了,畢竟html5原生的就給我們提供了檔案上傳的api。plupload是一款由著名的web編輯器tinymce團隊開發的上傳元件,簡單易用且功能強大,我們完全可以使用plupload來代替以前的swfupload。

plupload有以下功能和特點:

1、擁有多種上傳方式:html5、flash、silverlight以及傳統的。plupload會自動偵測當前的環境,選擇最合適的上傳方式,並且會優先使用html5的方式。所以你完全不用去操心當前的瀏覽器支援哪些上傳方式,plupload會自動為你選擇最合適的方式。

2、支援以拖拽的方式來選取要上傳的檔案

3、支援在前端壓縮,即在檔案還未上傳之前就對它進行壓縮

4、可以直接讀取原生的檔案資料,這樣的好處就是例如可以在檔案還未上傳之前就能把它顯示在頁面上預覽

5、支援把大檔案切割成小片進行上傳,因為有些瀏覽器對很大的檔案比如幾g的一些檔案無法上傳。

以上的介紹就先到這裡,接下來就是實戰**和具體用法,重頭戲來了:

1,首先需要引入plupload.js 和 jquery.js  的檔案:

2,在html **中的 body 標籤內編寫相應的**:

plupload檔案上傳外掛程式

plupload檔案上傳外掛程式 plupload 說明文件 參考樣例 上傳 最大500kb,支援jpg,gif,png格式。載入script 當點選按鈕 上傳 後,彈出選擇檔案對話方塊,按 ctrl 選擇多上傳。然後呼叫 uploader.start 方法,開始上傳。上傳中間過程我們可以用 upl...

檔案上傳plupload元件使用

這段時間一直在使用檔案上傳,簡要的介紹一下檔案上傳的元件使用,先上一段 var uploader new plupload.uploader flash位址,swf檔案,當需要使用swf方式進行上傳時需要配置該引數 flash swf url sikns js moxie.swf silverlig...

plupload檔案上傳詳解及擴充套件

2.檔案引用 3.使用步驟 1 html結構 選擇檔案 開始上傳 2 js 例項化 初始化 事件監聽 以自己的本地專案為例 例項化uploader物件 var uploader new plupload.uploader if err.code 600 filters max file size 2...