Upload an image when a button is clicked using jQuery

Question

I have an image on my page. I want the image to load when I click the button. How to do this using jQuery or Javascript? Please provide me the violin. Fiddle

<div id="download"> <img src="http://www.glamquotes.com/wp-content/uploads/2011/11/smile.jpg" id="image"> <button id="dwnld"> Download image </button> </div> 

Answer 1

In fact, you can do this using the HTML5 download attribute, if old browsers are a problem, you should use a server server for this and set the appropriate headers, etc.

 <a href="http://www.glamquotes.com/wp-content/uploads/2011/11/smile.jpg" download="smile.jpg">Download image</a> 

Fiddle

Answer 2

save.php will return

"1 | DOWNLOAD_NOS | Full_path | FILE_NAME" Or you can use jSON

 $('#save_wall').click(function(e) { e.preventDefault(); $.ajax({ type: "POST", url:"save.php", data: "id=<?=$_GET['id'];?>", success: function (dataCheck) { var m=dataCheck.split("|"); if(m[0] == '1') { alert("Thank You for your Download Picture\n\nShortly Picture Download will start..."); $('#save_wall_count').html(m[1]); var a = document.createElement('a'); a.href = m[2]; a.download = m[3]; document.body.appendChild(a); a.click(); document.body.removeChild(a); } if(m[0] == '0') alert("Error: Error in Save Picture or Not Found...\n\n"+ dataCheck); } }); });