介紹幾套好用的檔案上傳元件

檔案上傳幾乎每個專案都用的到,但 ASP.NET 2.0 的 FileUpload 控制項有點太陽春了,目前我從網路上找到的 File Upload 元件大多是透過 JavaScript + IFRAME 上傳,或用 JavaScript + Flash 上傳比較好用,今天介紹幾款不錯的。

  1. SWFUpload

    採用 JavaScript + Flash 進行上傳動作,功能強大、一應俱全,雖然每有 ASP.NET 現成的控制項可用,但是有提供使用 ASP.NET 的範例可以參考,是個值得推薦使用的套件!

    其功能有:

    - 可一次上傳多個檔案。
    - 支援 JavaScript 的 Callback 事件。
    - 可在檔案開始上傳前取得部分檔案資訊。
    - 可以透過 XHTML 與 CSS 客製化上傳的元件。
    - 可得知檔案上傳進度。
    - 上傳檔案不需要 PostBack,可以等上傳檔案完成後再 PostBack 出去。
    - 只要是 Flash 支援的 Browser 都可以用。
    - 就算 Flash 或 JavaScript 都無效的時候,也可以正常上傳。
    - 可以在「檔案上傳之前」就先判斷檔案大小,超過限制可以不進行上傳。
    - 可以在瀏覽檔案時篩選特定的檔案類型
    - 支援上傳檔案佇列功能,可以在還沒上傳檔案之前將新增要上傳的檔案或移除要上傳的檔案。

  2. FancyUpload

    這個套件就像他的名字一樣很花俏(Fancy),看過他的 Demo 就是到他的威力了。

    其功能有:

    - 可一次上傳多個檔案。
    - 可以在瀏覽檔案時篩選特定的檔案類型
    - 支援 JavaScript 的 Callback 事件。
    - 可在檔案開始上傳前取得部分檔案資訊。
    - 可以在「檔案上傳之前」就先判斷檔案大小,超過限制可以不進行上傳,也可限制上傳檔案數的上限。
    - 只要是支援 Flash 8 的 Browser 都可以用。
    - 支援上傳檔案佇列功能,可以在還沒上傳檔案之前將新增要上傳的檔案或移除要上傳的檔案。
    - 所有功能都可以設定,文件
    - 可得知檔案上傳進度。
    - 上傳檔案不需要 PostBack,可以等上傳檔案完成後再 PostBack 出去。
    - 就算 Flash 或 JavaScript 都無效的時候,也可以正常上傳。

  3. AjaxFileUpload

    這是一個 jQuery Plugin,也算是不錯用,只是功能沒像上面兩個那麼多功能,因為這套是用 JavaScript + IFRAME 的技巧實做的。

    如果你想找其他 jQuery Plugins 可以來這裡:http://plugins.jquery.com/

相關網址

 

  

此文章由 will 發表於 2008/2/26 上午 12:01:00

永久連結 | 評論 (9) | 此文章的RSSRSS comment feed |

分類: ASP.NET | JavaScript | Web

標籤: , , , , ,

收藏:

相關文章

評論

三月 24. 2008 18:31

阿第呀

板主你好:
我在 SWFUpload 的網站的 Demo 頁面看到它的功能真的超強大的!
(這一頁 http://demo.swfupload.org/)
但是我在站上很辛苦的(英文不好@@)找了很久 ASP.Net 的範例
只找到這一頁的 http://www.swfupload.org/node/7/release
可是這些範例似乎都只是部分功能的陽春範例耶.....
不知道是我沒找到還是他真的沒提供喔?
若是我眼拙沒找到,還請板主提供一下他的範例載點。謝謝~

另外,我發現 FancyUpload 跟無名相簿的很像耶,無名是不是就是用這個呀??
我也在 FancyUpload 的站上找了許久,它的範例都是 PHP 的,
不知道是不是又是我眼拙沒找到了@@
若他有 ASP.Net 的範例,也請板主順便告知一下囉~~

謝謝您!




阿第呀 tw

三月 24. 2008 19:11

Will 保哥

SWFUpload 算是個 JavaScript Library 啦,所以其實跟 ASP.NET 並沒直接關聯,如果你不熟悉 JavaScript 的話,使用 SWFUpload 起來會很受限制,因為只能參考他目前提供的 Demo 而已,且目前並沒有現成且完整的 SWFUpload ASP.NET 控制項。

所以建議你還是去往 JavaScript 的地方研究,不要費心去找 ASP.NET 的範例了。

Will 保哥 tw

三月 24. 2008 20:55

阿弟呀

喔,是喔...
這麼說意思是它主要是著重在 JS 的部分囉
我還以為是它有做好的控制項,只要拖進 aspx 的頁面,然後設定相關屬性就好了
唉....阿弟我 JS 的功力很不行說....
呵~只好放棄了~

謝謝板主的提示, 有空我再來加強 JS 好了~ ^_^

阿弟呀 tw

三月 24. 2008 23:22

Will 保哥

推薦你一本書:

JavaScript 大全 (JavaScript: The Definitive Guide, 5/e)
tlsj.tenlong.com.tw/.../bookSearchViewAction.do

Will 保哥 tw

三月 25. 2008 19:30

阿弟呀

呵~這本書我有,不過目前冷凍中.....
當時買來看了一些,可能因為是翻譯書的關係,感覺雖然是中文書,但是語句都很「外國人」,看起來很吃力,就....冷凍了,後來有買了一些別的 JavaScript 的中文書來看,不過因為這陣子突然接了個案子,忙到翻,暫時只剩下馬桶時間能看一下看一下的。呵~~

很謝謝板主您給的意見喔~
等這陣子忙過了再來加強 JavaScript 了~~ ^_^

阿弟呀 tw

六月 13. 2008 16:25

KINK

版大您好...
小弟再尋求上傳前計算檔案大小,而幸運的拜訪到此
想請教Fancy那套,如何才能運作順利呢
小弟已經反覆TRY過多次,一點反應都沒有...
我的做法是把範例COPY下來,每個連結都確認過有到位..
但就是沒反應><...
可能小弟功力太淺,煩請版大說明一下好嗎
感謝感謝.....

KINK tw

六月 13. 2008 17:01

will

你這樣問我也不知道怎麼幫你,可能是 JavaScript 的衝突吧,你這個頁面是否有載入 jQuery 或其他 JavaScript Library 造成 JavaScript Error 呢?

will tw

六月 16. 2008 13:10

KINK

版大您好...
小弟我在瀏覽這套件時,並沒有發現該版大提供完整範例
所以小弟是把他的DEMO頁拷了下來Tong,先讓本機可以使用
再TRYTRY怎麼修改語法,以配合自己需要的.....
但是不管我把所有的資源都LINK好之後,他依然沒反應
我的檔案是這樣...
http://www.badongo.com/file/9910035
麻煩版大可以幫我看看嗎...謝謝

KINK tw

五月 1. 2009 12:02

will

FancyUpload - Swiff meets Ajax (v3.0) 剛出爐喔!
http://digitarald.de/project/fancyupload/

will tw

新增評論


(將顯示您的Gravatar圖示)  

  Country flag

[b][/b] - [i][/i] - [u][/u]- [quote][/quote]



線上預覽

七月 4. 2009 20:59