1.引入js
<script src="~/media/jquery-1.10.1.min.js"></script> <script src="~/media/ajaxfileupload.js"></script> 2.html页面 <label class="control-label">预览图片</label> <img src="~/Image/1.jpg" id="img" style="width: 100px;" /> <input type="file" id="fileposition" name="file" /> <br /> <br /> <div class="submit-btn"> <input type="button" id="btn_add" value="添加" /> </div> <br /> <br /> <img src="~/Image/1.jpg" id="img1" style="width: 200px" /> 3.script <script type="text/javascript"> $(function () { function GetImgUrl(file) { var url = null; if (window.URL != undefined) { url = window.URL.createObjectURL(file); } return url; } //图片进行预览 $("#fileposition").change(function () { var url = GetImgUrl(this.files[0]); $("#img").attr("src", url); }); $("#btn_add").click(function () { var fileposition = $("#fileposition").val(); if (fileposition == "") { $("#fileposition").focus(); alert("来自网页的消息：信息填写不完整，请选择图片！"); return; } else { $.ajaxFileUpload({ url: '/Home/Add', dataType: 'json', fileElementId: 'fileposition', success: function (result) { if (result.Code == 1) { alert(result.Mes); //var url = GetImgUrl(this.files[0]); $("#img1").attr("src", "/Image/" + result.Names); } else { alert(result.Mes); } //window.location.href = 'Index'; } }) } }) }) </script> 4. Controller public ActionResult Add() { string imgurl = ""; if (Request.Files.Count > 0) { Guid guid = Guid.NewGuid(); Request.Files[0].SaveAs(Server.MapPath("~") + "/Image/" + guid + Request.Files[0].FileName); imgurl += guid + Request.Files[0].FileName; return Json(new { Code = 1, Mes = "添加成功！",Names=imgurl }, JsonRequestBehavior.AllowGet); } else { return Json(new {Code =0,Mes="添加失败！" },JsonRequestBehavior.AllowGet); } } 注意：在项目里要创建个Image文件夹
