分享一個HTML5的上傳jQuery插件 - jQuery HTML5 uploader

隨着HTML5的使用愈來愈被你們接受，基於HTML5的技術和插件也會變得愈來愈普遍，今天咱們介紹一款基於HTML5和jQuery的上傳插件: jQuery HTML5 uploader。

使用這個插件將會使得文件上傳變得簡單和有趣，你只須要拖拽文件到頁面特定區域就能夠上傳文件。

 

 

在線演示   在線下載

使用方法：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.html5uploader.min.js"></script>
<script type="text/javascript">
$(function () {
    $("#dropbox, #multiple").html5Uploader({
        name: "foo",
        postUrl: "bar.aspx"    
    });
});
</script>
<div id="dropbox"></div>
<input id="multiple" type="file" multiple>

參數設定：

• name: 上傳字段標示
• postUrl: 文件數據處理URL
• onClientAbort: 讀取操做終止時調用
• onClientError: 出錯時調用
• onClientLoad: 讀取操做成功時調用
• onClientLoadEnd: 不管是否成功，讀取完成時調用。一般在onload和onerror後調用
• onClientLoadStart: 讀取將要開始時調用
• onClientProgress: 數據在讀取過程當中週期性調用
• onServerAbort: post操做結束時調用
• onServerError: 錯誤發生時調用
• onServerLoad: post操做成功時調用
• onServerLoadStart: post數據將要開始時調用
• onServerProgress: 數據正在被post的過程當中週期性調用
• onServerReadyStateChange: 一個javascript功能對象不管任什麼時候候readyState屬性變化時調用。callback由用戶界面現成調用。

原文來自：分享一個HTML5的上傳jQuery插件 - jQuery HTML5 uploader