您好,登錄后才能下訂單哦!
Uploadify控件如何在ASP.NET中使用?相信很多沒有經(jīng)驗(yàn)的人對此束手無策,為此本文總結(jié)了問題出現(xiàn)的原因和解決方法,通過這篇文章希望你能解決這個問題。
對于Uploadify文件上傳之前已經(jīng)講過一次(文件上傳~Uploadify上傳控件),只不過沒有涉及到多文件的上傳,這回主要說一下多個文件的上傳,首先,我們要清楚一個概念,多文件上傳前端Uploadify是通過輪訓(xùn)的方式去調(diào)用我們的后臺upload程序的,所以,對于多文件上傳來說,也沒什么稀奇的.
一 HTML模版
<script type="text/html" id="liTemp"> <li> <!--上傳后狀態(tài)--> <div class="VedioChange"> <dl> <dt> <a href="javascript:;"> <img width="140" height='92' src="{src}" alt="{alt}" /><span class="playIcon"></span></a> <input type="hidden" name="HdFileURL" value="{FilePath}" /><br /> <input type="hidden" name="HdImagePath" value="{ImagePath}" /><br /> <input type="hidden" name="HdSourceName" value="{SourceName}" /><br /> <input type="hidden" name="HdFileSize" value="{FileSize}" /><br /> </dt> <dd><a href="javascript:;" class="lookBig">預(yù)覽</a> <a href="javascript:;" class="reselect" onclick="del(this)">關(guān)閉</a></dd> </dl> </div> <!--上傳后狀態(tài)--> </li> </script>
二 uploadfiy代碼
<script type="text/javascript"> $(document).ready(function () { $("#uploadify").uploadify({ 'uploader': 'js/jquery.uploadify-v2.1.4/uploadify.swf', 'script': 'UploadHandler.ashx', 'cancelImg': 'js/jquery.uploadify-v2.1.4/cancel.png', 'folder': '/UploadFile/', 'queueID': 'fileQueue', 'auto': true, 'multi': true, 'onComplete': function (event, queueID, fileObj, response, data) {//當(dāng)單個文件上傳完成后觸發(fā) //event:事件對象(the event object) //ID:該文件在文件隊(duì)列中的唯一表示 //fileObj:選中文件的對象,他包含的屬性列表 //[name] - 已上傳文件的名稱 //[filePath] - 已上傳文件在服務(wù)器上的路徑 //[size] – 文件的大學(xué),單位為字節(jié) //[creationDate] – 文件的創(chuàng)建日期 //[modificationDate] – 文件的最后修改日期 //[type] – 文件的擴(kuò)展名,以‘.'開始 //response:服務(wù)器端返回的Response文本,我這里返回的是處理過的文件名稱 //data:文件隊(duì)列詳細(xì)信息和文件上傳的一般數(shù)據(jù) $("#preview").append(dataTemplate($("#liTemp").text(), { src: response, alt: fileObj.name })); }, 'onError': function (event, queueID, fileObj) {//當(dāng)單個文件上傳出錯時觸發(fā) alert("文件:" + fileObj.name + " 上傳失??!"); }, }); }); function del(o) { $(o).closest("li").remove(); } </script>
三 html代碼
<div class="rt"> <ul class="clearfix w_VedioChange" id="preview"> </ul> </div> <div id="fileQueue"></div>
四 ashx代碼
/// <summary> /// Summary description for UploadHandler /// </summary> public class UploadHandler : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; context.Response.Charset = "utf-8"; HttpPostedFile file = context.Request.Files["Filedata"]; string uploadPath = HttpContext.Current.Server.MapPath(@context.Request["folder"]); if (file != null) { if (!Directory.Exists(uploadPath)) { Directory.CreateDirectory(uploadPath); } file.SaveAs(Path.Combine(uploadPath, file.FileName)); var pathArr = uploadPath.Split('\\'); context.Response.Write(HttpContext.Current.Request.Url.Scheme + "://" + HttpContext.Current.Request.Url.Authority + "/" + pathArr[pathArr.Length - 2] + "/" + pathArr[pathArr.Length - 1] + "/" + file.FileName); } else { context.Response.Write("0"); } } public bool IsReusable { get { return false; } } }
看完上述內(nèi)容,你們掌握Uploadify控件如何在ASP.NET中使用的方法了嗎?如果還想學(xué)到更多技能或想了解更多相關(guān)內(nèi)容,歡迎關(guān)注億速云行業(yè)資訊頻道,感謝各位的閱讀!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。