加强版上传图片功能啊

一般处理程序

filename


using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace EFDemo
{
    /// <summary>
    /// FileUpload 的摘要说明
    /// </summary>
    public class FileUpload : IHttpHandler
    {

        public void ProcessRequest(HttpContext context)
        {
            var file = context.Request.Files["file"];
            var filename = "/Img/" + file.FileName;
            file.SaveAs(context.Server.MapPath("~/" + filename));
            context.Response.Write(filename);
        }

        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}


ImgController

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace EFDemo.Controllers
{
    public class ImgController : Controller
    {
        // GET: Img
        public ActionResult Index()
        {
            return View();
        }

        public void ImgUpload()
        {
            var file = Request.Files["fileImg"];

          
        }
    }
}
 
 
@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<style>
    .img {
        width: 80px;
        height: 80px;
        margin:10px;
    }
</style>

<div>
    @*<form id="imgfrom" method="post" enctype="multipart/form-data" action="~/FileUpload.ashx">
        </form>*@
    <input type="file" name="fileImg" id="fileImg" />

    <input type="button" value="上传" onclick="upload()" />
</div>
<div id="imgs">

</div>

<script src="~/Scripts/jquery-3.4.1.min.js"></script>

<script>

    function upload() {

        var formData = new FormData();
        formData.append("file", $("#fileImg")[0].files[0]);

        $.ajax({
            url: '/FileUpload.ashx',
            type: 'POST',
            data: formData,
            processData: false,
            contentType: false,
            success: function (responseStr) {
                alert("上传成功");

                var html = "<img   src='" + responseStr + "' class='img' />";

                $("#imgs").append(html);

            }
        });


    }

</script>
 
 
posted @ 2020-06-17 08:21  G蠢蠢  阅读(141)  评论(0编辑  收藏  举报