强制浏览器使用jquery点击链接下载图像

时间:2022-10-22 14:48:56

I would like to start download of an image on click of a link.

我想点击链接开始下载图像。

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

I know we can use download attribute of HTML5 (Force a browser to save file as after clicking link) but I would not like to use it as it will not be working in older versions of browsers. I did tried the method here: Download File Using Javascript/jQuery but it opens the image in the iframe .

我知道我们可以使用HTML5的下载属性(强制浏览器在点击链接后保存文件)但我不想使用它,因为它不适用于旧版本的浏览器。我在这里尝试了这个方法:使用Javascript / jQuery下载文件,但它会在iframe中打开图像。

Can anybody help me to force a browser to download an image onclick of a link using jquery?

任何人都可以帮我强迫浏览器使用jquery下载链接图像吗?

2 个解决方案

#1


7  

As far as I know there is no client-side cross-browser solution for this issue (doesn't matter using jQuery or any other UI toolkit). What you need to do in order to trigger browser to download a file is to add some HTTP headers to the server response:

据我所知,没有针对此问题的客户端跨浏览器解决方案(使用jQuery或任何其他UI工具包无关紧要)。要触发浏览器下载文件,您需要做的是向服务器响应添加一些HTTP标头:

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

This post may also be helpful for you.

这篇文章也可能对你有所帮助。

#2


5  

You can use the download attribute, while not fully supported across browsers, you can use modernizr to support/fallback for unsupported browsers.

您可以使用download属性,虽然浏览器不完全支持,但您可以使用modernizr来支持/支持不受支持的浏览器。

For supported browsers, check http://caniuse.com/#feat=download

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

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

#1


7  

As far as I know there is no client-side cross-browser solution for this issue (doesn't matter using jQuery or any other UI toolkit). What you need to do in order to trigger browser to download a file is to add some HTTP headers to the server response:

据我所知,没有针对此问题的客户端跨浏览器解决方案(使用jQuery或任何其他UI工具包无关紧要)。要触发浏览器下载文件,您需要做的是向服务器响应添加一些HTTP标头:

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

This post may also be helpful for you.

这篇文章也可能对你有所帮助。

#2


5  

You can use the download attribute, while not fully supported across browsers, you can use modernizr to support/fallback for unsupported browsers.

您可以使用download属性,虽然浏览器不完全支持,但您可以使用modernizr来支持/支持不受支持的浏览器。

For supported browsers, check http://caniuse.com/#feat=download

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

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