javascript - 使用 jQuery 单击按钮下载图像

Question

我的页面中有一张图片。我希望在单击按钮时下载图像。如何使用 jQuery 或 Javascript 做到这一点？请给我一把小提琴。小提琴

<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

您实际上可以使用 HTML5download属性执行此操作，如果较旧的浏览器有问题，您应该为此使用服务器端，并设置适当的标头等。

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

小提琴

Answer 2

save.php 将返回

"1|DOWNLOAD_NOS|FULL_PATH|FILE_NAME" 或者你可以使用 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);
    }
  });		
});