CODEWITHSUNDEEP
javascriptjquery
John Mac
John Mac

Reputation: 2550

Open the Save Image dialog using jQuery/Javascript?

When a user clicks on an image on a web page, I'd like to trigger the browser's Save Image dialog and to let the user save the image on their hard drive. Is there a cross-browser way to do this with jQuery/Javascript?

Upvotes: 11

Views: 35965

Answers (5)

mheg
mheg

Reputation: 121

you can create a hidden file-input field and trigger() this one, when you click on your image:

$('.yourImageClass').click(function(){
 $('.hiddenInputClass').trigger('click');
})

Upvotes: 1

DrJKL
DrJKL

Reputation: 43

Google Webstore
Github

I made an extension that does something like this, if anyone here is still interested. It uses an XMLHTTPRequest to grab the object, which in this case is presumed to be an image, then makes an ObjectURL to it, a link to that ObjectUrl, and clicks on the imaginary link.

In your case, you could just change ondragend to onclick and selectively add it to images.

Upvotes: 0

Craig Stuntz
Craig Stuntz

Reputation: 126547

Not precisely, but you can do it by hyperlinking to the img file and setting the content-type and content-disposition headers in the server response. Try, e.g., application/x-download, plus the other headers specified here.

Upvotes: 11

Christian C. Salvadó
Christian C. Salvadó

Reputation: 827496

The only thing that comes to my mind is the document.execCommand("SaveAs") of Internet Explorer, you can open a window or use a hidden iframe with the url of your image, and then call it...

Check (with IE of course) this example I've done.

Upvotes: 2

nickf
nickf

Reputation: 546085

I don't imagine so - a lot of the basic browser functionality (eg: Print Preview) isn't available to Javascript.

Upvotes: 0

Related Questions