隨著HTML5的使用越來越被大家接受，基于HTML5的技術(shù)和插件也會變得越來越廣泛，今天我們介紹一款基于HTML5和jQuery的上傳插件: jQuery HTML5 uploader。

使用這個插件將會使得文件上傳變得簡單和有趣，你只需要拖拽文件到頁面特定區(qū)域就可以上傳文件。

在線演示  在線下載

使用方法：

<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> 

參數(shù)設(shè)定：

◆ name: 上傳字段標(biāo)示

◆ postUrl: 文件數(shù)據(jù)處理URL

◆ onClientAbort: 讀取操作終止時調(diào)用

◆ onClientError: 出錯時調(diào)用

◆ onClientLoad: 讀取操作成功時調(diào)用

◆ onClientLoadEnd: 無論是否成功，讀取完成時調(diào)用。通常在onload和onerror后調(diào)用

◆ onClientLoadStart: 讀取將要開始時調(diào)用

◆ onClientProgress: 數(shù)據(jù)在讀取過程中周期性調(diào)用

◆ onServerAbort: post操作結(jié)束時調(diào)用

◆ onServerError: 錯誤發(fā)生時調(diào)用

◆ onServerLoad: post操作成功時調(diào)用

◆ onServerLoadStart: post數(shù)據(jù)將要開始時調(diào)用

◆ onServerProgress: 數(shù)據(jù)正在被post的過程中周期性調(diào)用

◆ onServerReadyStateChange: 一個javascript功能對象無論任何時候readyState屬性變化時調(diào)用。callback由用戶界面現(xiàn)成調(diào)用。

原文：http://www.cnblogs.com/gbin1/archive/2011/11/18/2254212.html

【編輯推薦】

1. 15個值得開發(fā)者關(guān)注的jQuery開發(fā)技巧和心得
2. 使用HTML 5、CSS3和jQuery增強(qiáng)網(wǎng)站用戶體驗
3. 11月30個讓你網(wǎng)站更炫的jQuery插件推薦
4. JNotify：一個消息通知jQuery插件
5. 10月10款有趣強(qiáng)大的jQuery插件推薦