杭州盘石做网站专业吗,做兼职什么网站比较好,网页设计代码显示时间,如何建立自己的电商平台因项目需求#xff0c;需要一个上传图片并显示的功能#xff0c;类似于上传头像并显示出来。查阅了网上资料#xff0c;写了个Demo#xff0c;希望能帮助到更多的人。此Demo基于ASP.NET MVC实现。 选择图片#xff1a; 点击按钮进行上传#xff1a; 一、先在项目中新建一… 因项目需求需要一个上传图片并显示的功能类似于上传头像并显示出来。查阅了网上资料写了个Demo希望能帮助到更多的人。此Demo基于ASP.NET MVC实现。 选择图片 点击按钮进行上传 一、先在项目中新建一个文件夹用于存放图片 二、View页面代码
{Layout null;
}!DOCTYPE html
html
headmeta http-equivContent-Type contenttext/html; charsetutf-8 /meta charsetutf-8 /meta nameviewport contentwidthdevice-width, initial-scale1.0script src~/Scripts/jquery-3.3.1.min.js/scriptscript src~/Scripts/jquery.unobtrusive-ajax.min.js/script
/head
bodyusing (Ajax.BeginForm(, null, new AjaxOptions() { OnSuccess PostSuc, OnFailure PostFail, HttpMethod Post }, new { enctype multipart/form-data, id FormBaseData })){input typehidden nameMouldId idMouldId value9527 /input typefile namefile1 /input typebutton valuesubmit idbtnSubmit /img src width300 height300 display:inline; alt图片预览 idmypicture /}
/body
/htmlscript typetext/javascript$(document).ready(function () {$(#btnSubmit).bind(click, function () { Query(); });})function Query() {$(#FormBaseData).attr(data-ajax-success, OnQuerySuccess(data));$(#FormBaseData).attr(data-ajax-failure, OnQueryFail());$(#FormBaseData).attr(action, /home/UploadImg);$(#FormBaseData).submit();}function OnQuerySuccess(data) {$(#mypicture).attr({ src: data });}function OnQueryFail() {alert(发生错误!);}
/script
三、Controller端代码
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;namespace WebApplication1.Controllers
{public class HomeController : Controller{public ActionResult Index(){return View();}[HttpPost]public ActionResult UploadImg(long MouldId){string msg string.Empty;if (Request.Files.Count 0){HttpPostedFileBase file Request.Files[file1];if (file.ContentLength 5 * 1024 * 1024){string fileType System.IO.Path.GetExtension(file.FileName);//获取文件类型if (!System.IO.Directory.Exists(Server.MapPath(~/Pictures/))){System.IO.Directory.CreateDirectory(Server.MapPath(~/Pictures/));}string filePath Server.MapPath(~/Pictures/);//保存文件的路径if (fileType ! null){fileType fileType.ToLower();//将文件类型转化成小写if ((.gif)|(.jpg)|(.bmp)|(.jpeg)|(.png).Contains(fileType)){file.SaveAs(filePath file.FileName);string str Pictures/ file.FileName;msg str;}else{msg 只支持图片格式;}}}else{msg 图片大小不能超过5M;}}else{msg 上传图片不能为空;}return Content(msg);}}
}参考https://blog.csdn.net/weixin_44540201/article/details/89630530