Image onclick画像をダウンロードするjavascript/jquery

Question

下記の例のように画像をクリックして保存します。

http://www.thrombosisadviser.com/en/resources/image-library/index.php

小さな画像をクリックするとポップアップが画像をダウンロードして保存するための準備がされますダウンロードボタンを押して、ダウンロードボタンが表示されます。

私はjavascript/Jqueryでのみ同じことをしたいと思います。助けてください&提案してください。

いつもありがとうございました。

Answer 1

JavaScriptを単独でダウンロードして保存することはできません。また、サーバーサイドスクリプトも使用する必要があります。 javascriptからはリクエストを開始するだけで、期待通りの結果を生むのはサーバーサイドスクリプトです。したがって、画像をダウンロードするにはjavascriptを使用してajaxリクエストを開始することができ、サーバーサイドスクリプトではブラウザにダウンロードダイアログを開始するhttpヘッダーを設定します。

Content-Disposition：attachment; filename = "image.jpg";

それ以外の場合は、サーバーからバイナリ応答として取得します。もう一度、javascriptを使用してファイルを書き込むセキュリティ違反であるため、クライアントマシン上のファイルとしてjavascriptを書き込む必要があります。

希望、これはあなたが

Answer 2

画面上の各画像に対して、大きなバージョンの画像とダウンロードボタンを持つ隠しファイルdivを作成します。適切な画像がクリックされたら、適切な隠しdivオブジェクトを表示します。

ワーキングデモ：http://jsfiddle.net/K3Jkf/2/

それは、Ajaxとの事のこのタイプ（スタンドアロンのPHPページ）を行うのが最善ですが、あなたが言ったように、あなたはそれを行うことを好みません。