首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >使用JavaScript点击按钮下载图片

使用JavaScript点击按钮下载图片
EN

Stack Overflow用户
提问于 2020-07-20 01:30:41
回答 1查看 86关注 0票数 0

我有一个带有数据URL和按钮的图像。

现在,我想使用JavaScript下载该镜像。到目前为止,我得到了这个代码,但在下载图像后,它说:它看起来我们不支持这种格式。

代码语言:javascript
代码运行次数:0
运行
复制
<img src="data:image/png;base64,iVBORw0KGgoA....." class="filterImage">

<input type="button" name="button" value="Save" id="saveImg" class="btn btn-primary float-right">
代码语言:javascript
代码运行次数:0
运行
复制
function saveImage() {  
  let image = document.querySelector(".filterImage");
  var img = new Image(); 
  
  img.onload = function() {
        let canvas = document.createElement("canvas");
        let width = canvas.width;
        let height = canvas.height;
        let context = canvas.getContext("2d");
        context.drawImage( image, 0, 0, width, height );    
  }

  img.src = image.src;
   
  let link = document.createElement('a');
  link.download = "image.png";
  link.style.opacity = "0";
  link.href = image.src;
  document.body.append(link);   
  link.click();
  link.remove();
}
        
saveImage(); // For testing purpose I am directly calling this function

我有什么地方错了吗?我该怎么解决它呢?

EN

回答 1

Stack Overflow用户

发布于 2020-07-21 08:00:05

有些浏览器不允许以编程方式点击链接(通过~link.click());例如,当我尝试这样做时,Chrome会导航到"#blocked“。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/62983549

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档