|
Uploadify是JQuery的一個(gè)上傳插件,實(shí)現(xiàn)的效果非常不錯(cuò),帶進(jìn)度顯示。不過(guò)官方提供的實(shí)例時(shí)php版本的,本文將詳細(xì)介紹Uploadify在ASPNET中的使用,您也可以點(diǎn)擊下面的鏈接進(jìn)行演示或下載。
首先按下面的步驟來(lái)實(shí)現(xiàn)一個(gè)簡(jiǎn)單的上傳功能。
1 創(chuàng)建Web項(xiàng)目,命名為JQueryUploadDemo,從官網(wǎng)上下載最新的版本解壓后添加到項(xiàng)目中。
2 在項(xiàng)目中添加UploadHandler.ashx文件用來(lái)處理文件的上傳。
3 在項(xiàng)目中添加UploadFile文件夾,用來(lái)存放上傳的文件。
進(jìn)行完上面三步后項(xiàng)目的基本結(jié)構(gòu)如下圖:
4 Default.ASPx的html頁(yè)的代碼修改如下:
代碼
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Uploadify</title>
<link href="JS/jquery.uploadify-v2.1.0/example/css/default.css"
rel="stylesheet" type="text/css" />
<link href="JS/jquery.uploadify-v2.1.0/uploadify.css"
rel="stylesheet" type="text/css" />
<script type="text/Javascript"
src="JS/jquery.uploadify-v2.1.0/jquery-1.3.2.min.js"></script>
<script type="text/Javascript"
src="JS/jquery.uploadify-v2.1.0/swfobject.js"></script>
<script type="text/Javascript"
src="JS/jquery.uploadify-v2.1.0/jquery.uploadify.v2.1.0.min.js"></script>
<script type="text/Javascript">
$(document).ready(function()
{
$("#uploadify").uploadify({
'uploader': 'JS/jquery.uploadify-v2.1.0/uploadify.swf',
'script': 'UploadHandler.ashx',
'cancelImg': 'JS/jquery.uploadify-v2.1.0/cancel.png',
'folder': 'UploadFile',
'queueID': 'fileQueue',
'auto': false,
'multi': true
});
});
</script>
</head>
<body>
<div id="fileQueue"></div>
<input type="file" name="uploadify" id="uploadify" />
<p>
<a href="Javascript:$('#uploadify').uploadifyUpload()">上傳</a>|
<a href="Javascript:$('#uploadify').uploadifyClearQueue()">取消上傳</a>
</p>
</body>
</html>
it知識(shí)庫(kù):jQuery上傳插件Uploadify使用詳解,轉(zhuǎn)載需保留來(lái)源!
鄭重聲明:本文版權(quán)歸原作者所有,轉(zhuǎn)載文章僅為傳播更多信息之目的,如作者信息標(biāo)記有誤,請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除,多謝。