手机端图片有很大的,上传的时候很慢,这时候就要压缩一下了,有一个开源的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. 实验三同学评论http://home.cnblogs.com/u/MyDring/

    47赖燕菲http://www.cnblogs.com/lyfzero/ :该同学实验整体思路较清晰,希望把完整代码发布出来. 48李小娜http://www.cnblogs.com/dmbs/ :该 ...

  2. Oracle Spatial中SDO_Geometry详细说明[转]

    在ArcGIS中通过SDE存储空间数据到Oracle中有多种存储方式,分别有:二进制Long Raw .ESRI的ST_Geometry以及基于Oracle Spatial的SDO_Geometry等 ...

  3. 通用javascript方法

    //将序列化成json格式后日期(毫秒数)转成日期格式 YYYY-MM-DD HH:MI:SS function ChangeDateFormat(cellval, type) { var date ...

  4. Docker: 解决Docker无法在电信网络中访问外网

    在电信网络中,Docker在build和run时会无法访问外网,原因是docker的默认dns地址是8.8.8.8,由于众所周知的原因,我们需要改写这个地址,方法如下: 修改/etc/sysconfi ...

  5. 浅谈DES加密算法

    一.DES加密算法介绍 1.要求密钥必须是8个字节,即64bit长度 2.因为密钥是byte[8] , 代表字符串也可以是非可见的字节,可以与Base64编码算法一起使用 3.加密.解密都需要通过字节 ...

  6. MX4连接后adb无法识别解决方法

    1. 使用android SDK目录中的 android SDK目录\tools 下的android脚本,命令行中执行 android update adb,成功运行后,会在用户名录下产生,C:\Us ...

  7. IOS开发--常用工具类收集整理(Objective-C)(持续更新)

    前言:整理和收集了IOS项目开发常用的工具类,最后也给出了源码下载链接. 这些可复用的工具,一定会给你实际项目开发工作锦上添花,会给你带来大大的工作效率. 重复造轮子的事情,除却自我多练习编码之外,就 ...

  8. Objective-C之Block

    Block基本概念 本小节知识点: [了解]什么是Block [理解]block的格式 1.什么是Block Block是iOS中一种比较特殊的数据类型 Block是苹果官方特别推荐使用的数据类型, ...

  9. virt manager 提示权限不允许(ubuntu)

    问题描述: 新安装virt manager 打开提示权限不允许(ubuntu 15.04); 提示检查libvirt-bin包是否安装:libvirtd服务是否已运行:当前用户是否在libvirtd组 ...

  10. ISO9126软件质量模型

    ISO9126软件质量模型,是评价软件质量的国际标准.6个特性27个子特性组成. ISO/IEC9126软件质量模型是一种评价软件质量的通用模型,包括3个层次: 1.质量特性 2.质量子特性 3.度量 ...