【问题标题】:How to make multiple Image download by single click如何通过单击进行多个图像下载
【发布时间】:2017-12-17 17:13:01
【问题描述】:

我需要允许用户通过检查文件并单击按钮来下载多个图像。现在,我在每张图片下方都提供了一个链接以供下载。

但我需要选择多个图像并允许通过单击下载它。对于选择多个图像,我已经放置了复选框,但不知道如何进行多个下载。

【问题讨论】:

  • 当用户点击按钮时,创建一个包含所有检查过的图像的 zip 文件,并将该 zip 文件添加到 http 响应中,以便开始下载。

标签: javascript c# asp.net


【解决方案1】:

我建议将服务器端的文件压缩为一个文件并提供该文件。

如果这不是一个选项,您可以执行循环通过下载链接的 JavaScript,例如:

给定一个带有三个下载链接的普通 html。

<ul>
<li>
  <input name="checkbox" value="/download1.jpg">Download Image 1
</li>
<li>
  <input name="checkbox" value="/download2.jpg">Download Image 2
</li>
<li>
  <input name="checkbox" value="/download3.jpg">Download Image 3
</li>
</ul>
<a href="#" onclick="downloadSelected()">Download</a>

那么你有以下 javascript。您的用户会收到来自浏览器的警告,因为可以阻止多个弹出窗口。

  function downloadSelected() {
    $('input[type=checkbox]:checked').each(function() {
      window.open($(this).val());
    });
    return false;
  }

Plunker 中的工作示例:http://plnkr.co/edit/0ERMZ4VyXzvE0iebGMfb

【讨论】:

  • 需要传img url或者id吗?
  • 但是图像没有被下载。它正在新窗口中打开
  • 我已经尝试了上述方法,但没有得到我所期望的是他们通过单击事件下载多个图像的任何方式
  • 但是它以八位字节流格式下载如何使其成为图像格式
  • Content-Type 由服务器设置。因此,您可能在那里遇到问题,但它与此处发布的问题没有直接关系。如果要下载的文件是图像,我想知道为什么它会响应 octet-stream。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-06-24
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2018-01-13
相关资源
最近更新 更多