微客导航 » 文章资讯 » 推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)

推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)

2024-02-25 06:58:03 254

涉及到网页图片的交互，少不了图片的压缩上传，相关的插件有很多，相信大家都有用过，这里我就推荐三款，至于好处就仁者见仁喽：

1.名气最高的WebUploader，由BaiduFEX团队开发，以H5为主，FLASH为辅，兼容IE6+，iOS6+,android4+，采用大文件分片并发上传，极大的提高了文件上传效率，看了官方文档就知道，能满足你所需要的所有功能，一言以蔽之，大而全；至于缺点，大概就是插件体积太大了，自带样式文件，而且还要依赖jquery类库。详细的教程网上俯拾即是，这里我就附上一段简单的demo：






实验

选择文件

2.移动端的插件，如果能脱离jquery，并且能满足项目的基本需求就再好不过了，这里像localResizeIMG就做得不错，它有4个历史版本，建议引入最新稳定版本localResizeIMG4，demo如下（样式要自己写）：






实验

3.以上两款优缺点一目了然，本人公司用的是LUploader，纯原生js写的，不依赖任何类库，压缩后的js文件只有5k，实现图片压缩上传只需三步：

(1)在html页面中引入input标签，通过自定义属性data-LUploader绑定点击触发的标签id：








单击上传

(2)将样式文件和js文件引入到页面中：

(3)js脚本中初始化插件：

newLUploader(这里放需要绑定的input对象作为参数,{
url:'',//post请求地址
multiple:false,//是否一次上传多个文件默认false
maxsize:102400,//忽略压缩操作的文件体积上限默认100kb
accept:'image/jpg,image/jpeg,image/png',//如果写成image/*会出现响应慢的问题
quality:0.1,//压缩比默认0.1范围0.1-1.0越小压缩率越大
showsize:false//是否显示原始文件大小默认false
});

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

返回顶部
3162201930
czq8825@qq.com

推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)

热门推荐

随机推荐