.net MVC+Bootstrap下使用localResizeIMG上传图片
本文实例为大家分享了使用localResizeIMG上传图片的具体代码,供大家参考,具体内容如下
需要加载的头文件
html:
<div class="form-group"> <label class="col-sm-6 control-label" for="inputfile">维修照片上传</label> <div class="col-sm-6 "> <div style="background:url(../../fonts/add.png) no-repeat;width:151px;height:150px;float:left;" id="div1"> <input type="file" accept="image/*" id="file" class="selectinput" style="width:151px;height:150px;opacity:.01"> </div> </div> </div>
accept=“image/*” 这里有些手机可以拍照 有些不行 没有具体测试统计
$("#file").localResizeIMG({ width: 400, //height: 200, quality: 1, success: function (result) { var img = new Image(); img.src = result.base64; //$("body").append(img); $("#odd").append(img); //呈现图像(拍照結果) $.ajax({ url: "/Home/UploadImg", type: "POST", data: { "formFile": result.clearBase64, "RepairNum": $('#RepairNum').val()}, dataType: "HTML", timeout: 1000, error: function () { alert("ajax Error"); }, success: function (data) { //alert("Uploads success~") } }); } });
界面样式
后台action Base64StringToImage 需要把压缩后的Base64转换
[HttpPost] public ActionResult UploadImg() { var file = Request["formFile"]; var id = Request["RepairNum"]; string fileName = "1.jpeg"; string filePath = Server.MapPath("~/Upload/" + fileName); try { Base64StringToImage(file, filePath); //upImg.SaveAs(filePhysicalPath); //Session["ImgPath"] = path; //Base64StringToImage(file,); return Content("上传成功"); } catch { return Content("上传异常 !"); } } protected void Base64StringToImage(string strbase64, string filepath) { try { byte[] arr = Convert.FromBase64String(strbase64); MemoryStream ms = new MemoryStream(arr); System.Drawing.Bitmap bmp = new System.Drawing.Bitmap(ms); //bmp.Dispose(); bmp.Save(filepath, System.Drawing.Imaging.ImageFormat.Jpeg); ms.Close(); } catch (Exception ex) { } }
参考和下载GitHub:https://github.com/lyg945/localResizeIMG/tree/master/
参考文章:
localResizeIMG先压缩后使用ajax无刷新上传(移动端)
移动端使用localResizeIMG4压缩图片
基于javascript html5实现多文件上传
JS实现异步上传压缩图片
spring mvc+localResizeIMG实现HTML5端图片压缩上传
HTML5+Canvas调用手机拍照功能实现图片上传(上)
HTML5实现微信拍摄上传照片功能 遇到问题的解决方法
js实现纯前端的图片预览
推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)
H5图片压缩与上传实例
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
相关文章
- 这篇文章主要为大家详细介绍了ASP.NET购物车的实现过程,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2021-09-22
- 这篇文章主要介绍了.NET Core下使用Kafka的方法步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2021-09-22
- 在开发过程中,使用Visual Studio的断点调试功能可以很方便帮我们调试发现程序存在的错误,同样Visual Studio也支持对SQL Server里面的存储过程进行调试,下面就让我们看看具体的调试方法。...2021-09-22
- 这篇文章主要介绍了Win10 IIS 安装及.net 4.5及Win10安装IIS并配置ASP.NET 4.0的方法,本文给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下...2021-09-22
- 这篇文章主要介绍了详解.NET Core 3.0 里新的JSON API,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2021-09-22
- 这篇文章主要介绍了.net数据库操作框架SqlSugar的简单入门,帮助大家更好的理解和学习使用.net技术,感兴趣的朋友可以了解下...2021-09-22
- 这篇文章主要为大家分享了Bootstrap教程JS插件滚动监听学习笔记,内容很详细,感兴趣的小伙伴们可以参考一下...2016-05-20
- 这篇文章主要教大家如何利用Bootstrap3制作图片轮播效果,具有一定的参考价值,感兴趣的小伙伴们可以参考一下...2016-05-14
ASP.NET Core根据环境变量支持多个 appsettings.json配置文件
这篇文章主要介绍了ASP.NET Core根据环境变量支持多个 appsettings.json配置文件,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2021-09-22- 这篇文章主要介绍了记一次EFCore类型转换错误及解决方案,帮助大家更好的理解和学习使用asp.net core,感兴趣的朋友可以了解下...2021-09-22
- 这篇文章主要介绍了BootStrap和jQuery相结合实现可编辑表格的相关资料,需要的朋友可以参考下...2016-04-23
- ZXing是一个开放源码的,用Java实现的多种格式的1D/2D条码图像处理库,它包含了联系到其他语言的端口。这篇文章主要给大家介绍了.NET C#利用ZXing生成、识别二维码/条形码的方法,文中给出了详细的示例代码,有需要的朋友们可以参考借鉴。...2020-06-25
详解ASP.NET Core 中基于工厂的中间件激活的实现方法
这篇文章主要介绍了ASP.NET Core 中基于工厂的中间件激活的实现方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下...2021-09-22- 这篇文章主要介绍了C#使用Ado.Net更新和添加数据到Excel表格的方法,较为详细的分析了OLEDB的原理与使用技巧,可实现较为方便的操作Excel数据,需要的朋友可以参考下...2020-06-25
ASP.NET 2.0中的数据操作:使用两个DropDownList过滤的主/从报表
在前面的指南中我们研究了如何显示一个简单的主/从报表, 该报表使用DropDownList和GridView控件, DropDownList填充类别,GridView显示选定类别的产品. 这类报表用于显示具有...2016-05-19asp.net通过消息队列处理高并发请求(以抢小米手机为例)
这篇文章主要介绍了asp.net通过消息队列处理高并发请求(以抢小米手机为例),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2021-09-22ASP.NET单选按钮控件RadioButton常用属性和方法介绍
RadioButton又称单选按钮,其在工具箱中的图标为 ,单选按钮通常成组出现,用于提供两个或多个互斥选项,即在一组单选钮中只能选择一个...2021-09-22详解.NET Core 使用HttpClient SSL请求出错的解决办法
这篇文章主要介绍了.NET Core 使用HttpClient SSL请求出错的解决办法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧...2021-09-22- 这篇文章主要介绍了Python调用.NET库的方法步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧...2020-05-09
ASP.NET中iframe框架点击左边页面链接 右边显示链接页面内容
这篇文章主要介绍了ASP.NET中iframe框架点击左边页面链接,右边显示链接页面内容的实现代码,感兴趣的小伙伴们可以参考一下...2021-09-22