Asp.net mvc4用JQuery插件实现异步上传

时间:2022-11-30 16:36:55

下载异步上传插件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>

本文出自 “桂素伟” 博客,请务必保留此出处http://axzxs.blog.51cto.com/730810/1006272