javascript - Javascript 下载在 Firefox 和 IE 中不起作用

Question

我正在下载图像。它仅适用于 Chrome，不适用于 Firefox 或 IE。

        var a = document.createElement('a');
        a.href = canvas.toDataURL("image/jpeg").replace("image/jpeg", "image/octet-stream");
        a.download = 'Post-ITIE.jpg';
        a.click()

谁能帮助我它如何适用于所有浏览器。

JsFiddle 示例

帮助将不胜感激。谢谢

Answer 1

var fileName = 'Post-ITIE.jpg';

if ('msToBlob' in canvas) { // IE10+
  var blob = canvas.msToBlob();
  navigator.msSaveBlob(blob, fileName);
} else {
  var a = document.createElement('a');
  a.setAttribute('href', canvas.toDataURL());
  a.setAttribute('target', '_blank');
  a.setAttribute('download', fileName);
  a.style.display = 'none';
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}

它与最初提供的代码有几件不同的事情：

• 它检查是否msToBlob存在支持在 Internet Explorer 中下载文件的方法。
• 它将 a 添加target=blank到链接元素。即使浏览器不支持该download属性，这也可以确保显示图像。
• 它将链接添加到文档，以便.click()在 Firefox 中实际工作，然后将其删除。