使用 jquery 强制浏览器在单击链接时下载图像

Posted 2023-05-08

【中文标题】使用 jquery 强制浏览器在单击链接时下载图像

【英文标题】：Force browser to download an image on click of a link using jquery

【发布时间】：2013-11-08 10:41:19

【问题描述】：

我想通过点击链接开始下载图片。

<a id="downloadImage" href="imagepath">Click here to download</a>

我知道我们可以使用 html5 的下载属性 (Force a browser to save file as after clicking link)，但我不想使用它，因为它不能在旧版本的浏览器中工作。 我确实尝试过这里的方法： Download File Using javascript/jQuery 但它会在 iframe 中打开图像。

谁能帮我强制浏览器使用 jquery 下载链接点击图片？

【问题讨论】：

我认为这可以使用 Content-Disposition HTTP 标头从服务器解决。您使用的是什么服务器端技术？

Is there a way to force the user to download a file from a href link rather than to open it in a browser window? 的可能副本

@NikosParaskevopoulos 我想只使用客户端脚本下载这个...仅供参考，我们使用的是 Asp.Net

我的看法和 Vadim 的回答一样。

PDF 相同：***.com/questions/2598658/…

【参考方案1】：

据我所知，没有针对此问题的客户端跨浏览器解决方案（使用 jQuery 或任何其他 UI 工具包都没有关系）。为了触发浏览器下载文件，您需要做的是在服务器响应中添加一些 HTTP 标头：

Content-Type: application/octet-stream
Content-Disposition: attachment; filename=image.jpg

This 的帖子也可能对您有所帮助。

【讨论】：

我们如何在 asp.net 中做到这一点？

@Maninder 为asp.net添加header的官方文档：msdn.microsoft.com/en-us/library/ms524327(v=vs.90).aspx

css-tricks.com/snippets/htaccess/…

【参考方案2】：

您可以使用 download 属性，虽然不完全支持跨浏览器，但您可以使用 modernizr 支持/回退不支持的浏览器。

对于支持的浏览器，请查看http://caniuse.com/#feat=download

<a href="/path/to/image.jpg" title="ImageName" download="ImageName" >
    <img src="/path/to/image.jpg" >
</a>