上传图片的两种方法（ajaxFileUpload和webuploader）

上传图片的两种方法

  1、ajaxFileUpload上传图片

 

　　第一步：先引入jQuery与ajaxFileUpload插件。

　　ajaxFileUpload插件下载地址：http://files.cnblogs.com/files/kissdodog/ajaxfileupload_JS_File.rar

　　第二步：HTML代码

　　第三步：JS代码

 1 

　　第四步：后台代码

 1 　　　　　public ActionResult Upload()
 2         {
 3             NameValueCollection nvc = System.Web.HttpContext.Current.Request.Form;
 4 
 5             HttpFileCollection hfc = System.Web.HttpContext.Current.Request.Files;
 6             string imgPath = "";
 7             if (hfc.Count > 0)
 8             {
 9                 imgPath = "/testUpload" + hfc[0].FileName;
10                 string PhysicalPath = Server.MapPath(imgPath);
11                 hfc[0].SaveAs(PhysicalPath);
12             }
13             //注意要写好后面的第二第三个参数
14             return Json(new { Id = nvc.Get("Id"), name = nvc.Get("name"), imgPath1 = imgPath }, "text/html", JsonRequestBehavior.AllowGet);
15         }

　　最后 上传界面及图片展示：

　                      

 2、webuploader上传图片

　　第一步：先引入所需的插件。

　　webuploader官网上下载地址：http://fex.baidu.com/webuploader/

"~/Content/webuploader.css" rel="stylesheet" />

 

　　第二步：HTML代码

"uploadimg">
         
"fileList" class="uploader-list">
         
"imgPicker">选择图片

　　第三步：JS代码

 1 

　　第四步：控制器代码

 1 [HttpPost]
 2         public ActionResult upload(HttpPostedFileBase file)
 3         {
 4             if (file != null && file.ContentLength > 0)
 5             {
 6                 string folderpath = "/UploadFile/";//上传图片的文件夹
 7                 if (!Directory.Exists(folderpath))
 8                 {
 9                     Directory.CreateDirectory(Server.MapPath(folderpath));
10                 }
11                 string ext1 = Path.GetExtension(file.FileName);
12                 if (ext1 != ".gif" && ext1 != ".jpg" && ext1 != ".jpeg" && ext1 != ".png")
13                 {
14                     return Json(new { statu = 201, msg = "文件格式不正确！" });
15                 }
16                 else
17                 {
18                     string name = DateTime.Now.ToString("yyyyMMddHHmmssff");
19                     string ext = Path.GetExtension(file.FileName);
20                     string downpath = folderpath + name + ext;
21                     string filepath = Server.MapPath(folderpath) + name + ext;
22                     file.SaveAs(filepath);
23                     return Json(new { statu = 200, src = downpath, id = name });
24                 }
25             }
26             else
27             {
28                 return Json(new { statu = 202, msg = "请上传文件！" });
29             }
30 
31         }

　　最后 截图：上传界面以及上传的图片

　　

 

 

 

 

 

转载于:https://www.cnblogs.com/congcongliu/p/7494218.html