Asp.net mvc4用JQuery插件实现异步上传
生活随笔
收集整理的這篇文章主要介紹了
Asp.net mvc4用JQuery插件实现异步上传
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
下載異步上傳插件AjaxFileUploader,下載地址:http://phpletter.com/DOWNLOAD/
解壓,保存在 asp.net mvc項目的一個文件夾下,如下圖: 1.???????? Controller層 public ActionResult View3() { return View(); } [HttpPost] public ActionResult View3(HttpPostedFileBase file) { if (file == null) { return Content("沒有文件!", "text/plain"); } var fileName = Path.Combine(Request.MapPath("~/UploadFiles"), Path.GetFileName(file.FileName)); try { file.SaveAs(fileName);????????????? return Content("上傳成功!", "text/plain"); } catch { return Content("上傳異常 !", "text/plain"); } } 2.???????? View層: @{ Layout = null; } <!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width" /> <title>View1</title> <script src="~/Scripts/jquery-1.7.1.min.js"></script> <script src="~/ajaxfileupload/jquery.js"></script> <script src="~/ajaxfileupload/ajaxfileupload.js"></script> <script type="text/javascript"> function ajaxFileUploads() { $("#loading").ajaxStart(function () { $(this).show(); })//開始上傳文件時顯示一個圖片 .ajaxComplete(function () { $(this).hide(); });//文件上傳完成將圖片隱藏起來 $.ajaxFileUpload({ url: '/Test/View3',//后臺處理的action secureuri: false, fileElementId: 'file',//上傳的控件名 dataType: 'text', success: function (data, status) { $("#mydiv").html( data); }, error: function (data, status, e) { $("#mydiv").html( data + "" + e); } }) return false; } </script> </head> <body> <input type="file" id="file" name="file" /> <img src="../ajaxfileupload/loading.gif" width="20px" height="20px" id="loading" style="display: none;"> <span id="mydiv" style="color: green;"></span> <br /> <input type="button" value="上傳" ajaxFileUploads();"> </body> </html>總結
以上是生活随笔為你收集整理的Asp.net mvc4用JQuery插件实现异步上传的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 《面向模式的软件体系结构2-用于并发和网
- 下一篇: 用python连接redis时错误Inv