博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
截图后粘贴或拖拽上传
阅读量:6901 次
发布时间:2019-06-27

本文共 1859 字,大约阅读时间需要 6 分钟。

在浏览器中使用截图工具截图后直接粘贴到页面上传,以及拖拽到页面标签区域上传

主要使用了粘贴(paste)事件,以及拖拽(drag)事件,其中拖拽时要禁用浏览器的默认将图片打开的行为

例子:

HTML部分:

截图后粘贴或拖拽到下框:

js部分:

1 

调用:

后端保存图片部分代码:

[HttpPost]        public ActionResult UploadImage()        {            if (!System.IO.Directory.Exists(Server.MapPath("upload")))            {                System.IO.Directory.CreateDirectory(Server.MapPath("upload"));            }            if (Request.Files.Count == 0)            {                string strData = Request["AreaImgKey"].ToString(); //粘贴上传,取的base64编码                Bitmap img = Base64StringToImage(strData);                string imgName = "/" + DateTime.Now.ToString("yyyyMMddHHmmssfff") + ".jpg";                if (img != null)                {                    img.Save(Server.MapPath("upload") + imgName, System.Drawing.Imaging.ImageFormat.Jpeg);                    return Content("upload" + imgName);                }            }            else   //拖拽上传可直接拿到文件            {                string imgName = "/" + DateTime.Now.ToString("yyyyMMddHHmmssfff") + Request.Files[0].FileName;                Request.Files[0].SaveAs(Server.MapPath("upload") + imgName);                return Content("upload" + imgName);            }            return Content("");        }        protected Bitmap Base64StringToImage(string strbase64)        {            try            {                byte[] arr = Convert.FromBase64String(strbase64.Split(',')[1]);                MemoryStream ms = new MemoryStream(arr);                Bitmap bmp = new Bitmap(ms);                ms.Close();                return bmp;            }            catch (Exception ex)            {                return null;            }        }

demo源码地址:链接:https://pan.baidu.com/s/1bMdl5saJruVy0d4DcFj6Bg 密码:iqui

转载于:https://www.cnblogs.com/linJie1930906722/p/9615426.html

你可能感兴趣的文章
Vue:v-model指令
查看>>
Software Engineering | Strategy pattern
查看>>
ios开发系列-准备工作
查看>>
Android Studio调试手机或者安装APK的时候出现install failed test only
查看>>
js闭包
查看>>
Xcode +SVN
查看>>
设置界面分析
查看>>
SQL中DateTime转换成Varchar样式
查看>>
java.util.AbstractList
查看>>
几个常见用于解决nginx负载均衡的session共享问题的办法
查看>>
004-请问测试开发需要哪些知识?需要具备什么能力?
查看>>
遇到的测试笔试题-打印菱形
查看>>
setTimeOut、setInterval与clearInterval函数
查看>>
Appium原理及版本变化细节
查看>>
iphone ios 用xcode4.2开发 访问web service的功能
查看>>
Visual Studio 代码折叠快捷键(摘要)
查看>>
《2016ThoughtWorks技术雷达峰会----雷达新趋势》
查看>>
正则【备用】
查看>>
FeatureSelectors
查看>>
数据库防火墙DBShield安装
查看>>