手机端图片有很大的,上传的时候很慢,这时候就要压缩一下了,有一个开源的js可以压缩图片的大小,开源地址如下:https://github.com/think2011/localResizeIMG3

代码如下:

    // 上传图片
function uploadFile(path) {
var type = plus.storage.getItem("upload_goods_image");
//选择成功
$("#heisebg").removeClass("heisebg").addClass("heisebghid");
$("#waitingupload").removeClass("heisebghid").addClass("heisebg"); //https://github.com/think2011/localResizeIMG3
// 压缩图片
lrz(path, {
width: 500,
quality: 0.7,
done: function (results) {
$.ajax({
type: "POST",
url: configManager.RequstUrl + "api/common/base64upload",
async: true,
data: { base64: results.base64, size: results.base64.length, dir: "goods" }
}).done(function (data) {
if (data.state != "success") { console.log(data.message); return; }
var src = configManager.goodsImgurl.format(data.id, "") + '500-200';
if ("addspic" == type) {
var sImageStr = "<img width='98%' onclick='javascript:$(this).remove();' class='spic' title='{0}' src='{1}'>";
$("#addspic").before(sImageStr.format(data.id, src));
}
if ("addbpic" == type) {
var bImageStr = "<img width='98%' id='bpic' title='{0}' src='{1}'/>";
$("#addbpic").html(bImageStr.format(data.id, src));
}
$("#waitingupload").removeClass("heisebg").addClass("heisebghid");
try { myScroll.refresh(); } catch (err) { }
}).fail(function () {
plus.nativeUI.toast("上传失败!");
$("#waitingupload").removeClass("heisebg").addClass("heisebghid");
});
}
});
}

html5压缩图片并上传的更多相关文章

  1. 使用canvas压缩图片 并上传

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  2. HTML5裁剪图片并上传至服务器实现原理讲解

    HTML5裁剪图片并上传至服务器实现原理讲解   经常做项目需要本地上传图片裁剪并上传服务器,比如会议头像等功能,但以前实现这类需求都很复杂,往往需要先把图片上传到服务器,然后返回给用户,让用户确定裁 ...

  3. 导出HTML5 Canvas图片并上传服务器功能

    这篇文章主要介绍了导出HTML5 Canvas图片并上传服务器功能,文中通过实例代码给大家介绍了HTML5 Canvas转化成图片后上传服务器,代码简单易懂非常不错,具有一定的参考借鉴价值,需要的朋友 ...

  4. HTML5 Canvas前台压缩图片并上传到服务器

    1.前台代码: <input id="fileOne" type="file" /> <input id="btnOne" ...

  5. ios中摄像头/相册获取图片,压缩图片,上传服务器方法总结

    相册 iphone的相册包含摄像头胶卷+用户计算机同步的部分照片.用户可以通过UIImagePickerController类提供的交互对话框来从相册中选择图像.但是,注意:相册中的图片机器路径无法直 ...

  6. 基于HTML5多图片Ajax上传可预览

    html5多图控件<input id="fileImage" type="file" size="30" name="fil ...

  7. javaScript:压缩图片并上传

    html代码: <input id="file" type="file" name="filesName"> js代码: var ...

  8. Xamarin.Android 压缩图片并上传到WebServices

    随着手机的拍照像素越来越高,导致图片赞的容量越来越大,如果上传多张图片不进行压缩.质量处理很容易出现OOM内存泄漏问题. 最近做了一个项目,向webservices上传多张照片,但是项目部署出来就会出 ...

  9. js压缩图片并上传,不失真,保证图片清晰度

    <!DOCTYPE HTML> <html lang="zh-CN"> <head> <meta charset="UTF-8& ...

随机推荐

  1. 被混淆的C#类库的反编译

    今天看公司以前的代码,用的是.NRT Reactor v4.4.7.5进行的混淆,直接使用.NET Reflector v8.5.0.179 是无法查看的,提示:Invalid number of d ...

  2. 安卓开发_浅谈Android动画(一)

    动画效果,针对图片实现 现在学习四种基本的简单动画效果 一.Tween Animation共同属性 1.Duration:动画持续时间(毫秒单位) 2.fillAfter:设置为true,动画转化在动 ...

  3. IOS 沙盒机制 浅析

    IOS中的沙盒机制(SandBox)是一种安全体系,它规定了应用程序只能在为该应用创建的文件夹内读取文件,不可以访问其他地方的内容.所有的非代码文件都保存在这个地方,比如图片.声音.属性列表和文本文件 ...

  4. 真机测试时的错误:No matching provisioning profiles found

    1.出现错误的原因是这样的---- 公司开始做项目,原来做真机测试的时候,用的是公司申请的苹果开发者账号.现在项目结束了,准备上线,但客户要求使用客户自己的苹果开发者是账号上线,于是就用客户的账号测试 ...

  5. I/O多路复用——select函数与poll函数

    1 区别 同:(1)机制类似,本质上没有多大差别,管理多个描述符也是进行轮询,根据描述符的状态进行处理.(2)包含大量文件描述符的数组被整体复制于用户态和内核的地址空间之间,而不论这些文件描述符是否就 ...

  6. 2013MPD上海6.22 PM 陆宏杰:通往卓越管理的阶梯 & 6.23AM Ray Zhang 产品创新管理的十八般武艺

    MPD2天的内容,参加了5个课程,其中2个是管理的,分别是陆宏杰老师的<通往卓越管理的阶梯>和Ray Zhang大师的<产品创新管理的十八般武艺>.他们2个人都谈到了一个关于招 ...

  7. 基于Ubuntu虚拟机安装edx-platform

    基于Ubuntu虚拟机安装edx-platform   一. 前提准备 1. 虚拟机中安装Ubuntu12.04,然后再使用Vagrant方式搭建开发环境,请确保这个虚拟机可以使用2GB的内存,否则容 ...

  8. oracle REGEXP_SUBSTR函数

    REGEXP_SUBSTR函数格式如下: function REGEXP_SUBSTR(String, pattern, position, occurrence, modifier) __srcst ...

  9. HTTPS连接的前几毫秒发生了什么——Amazon HTTPS案例分析

    转自: http://blog.jobbole.com/48369/ 提示:英文原文写于2009年,当时的Firefox和最新版的Firefox,界面也有很大改动.以下是正文. 花了数小时阅读了如潮的 ...

  10. Solr 参考资料

    solr 的入门好资料 https://cwiki.apache.org/confluence/display/solr/Apache+Solr+Reference+Guide https://two ...