189 8069 5689

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

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

创新互联网站建设公司,提供成都做网站、网站建设,网页设计,建网站,PHP网站建设等专业做网站服务;可快速的进行网站开发网页制作和功能扩展;专业做搜索引擎喜爱的网站,是专业的做网站团队,希望更多企业前来合作!

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




 
 
 实验
 
 



 
选择文件

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




 
 
 实验
 


 
 

 
 
 



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

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

    单击上传

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

    
    
    

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

    new LUploader(这里放需要绑定的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
    });
    

    以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持创新互联。


    当前文章:推荐三款不错的图片压缩上传插件(webuploader、localResizeIMG4、LUploader)
    链接分享:http://cdxtjz.com/article/gdecej.html

    其他资讯