点击按钮实现图片下载


在做项目的时候,会遇到很多下载的功能,有时候我们点击按钮或者图片就在浏览器新打开一个tab预览或者右键才能保存,当前需求是点击按钮实现图片的自动下载。

原生js实现:

  /**
   * name: 图片下载后的名字
   * url:图片的地址
   */ 
  function downLoadImg(name, url) {
    var image = new Image();
    image.setAttribute('crossOrigin', 'anonymous');
    image.onload = function () {
      var canvas = document.createElement('canvas');
      canvas.width = image.width;
      canvas.height = image.height;
      var ctx = canvas.getContext('2d');
      ctx.drawImage(image, 0, 0, image.width, image.height);
      var url = canvas.toDataURL('image/png');
      var a = document.createElement('a');
      a.download = name;
      a.href = url;
      a.click();
    };
    image.src = url;
  }

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM