javascript - 使用 jQuery 在页面上下载多个文件

Question

我有一个页面，其中有许多要单独下载的文件链接。我认为如果有一个功能可以通过单击来触发所有文件的下载，那将是一个很好的功能。这是我为了测试这个而编写的脚本-

$('tbody tr a').slice(1).each(function(){  //don't mind the slice().
    console.log('starting download of: ' + $(this).attr('href')); // for debugging.
    $(this).attr('target','_blank'); //  so that a new page is opened for download.
    window.location.href = $(this).attr('href');
})

问题在于该脚本仅触发第一个下载链接的下载。但是，如果我看到控制台，则会打印所有文件的日志。我认为这是由于页面重定向而发生的。谁能帮我解决这个问题吗？

Answer 1

尝试替换 download window.location.href = $(this).attr('href') 的属性，调用.click()每个 <a>过滤选择器中的元素 $("tbody tr a").slice(1)在.each()点击<button>元素

var a = $("tbody tr a").slice(1);

$("button").click(function(e) {
  // download `a.txt`, `b.txt`
  a.each(function() {
    this.click()
  })
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
  <tbody>
    <tr>
      <td>
        <a href="data:text/plain,1" download="1.txt">1</a>
      </td>
    </tr>
    <tr>
      <td>
        <a href="data:text/plain,a" download="a.txt">a</a>
      </td>
    </tr>
    <tr>
      <td>
        <a href="data:text/plain,b" download="b.txt">b</a>
      </td>
    </tr>
  </tbody>
  <!-- click to download `a.txt`, `b.txt` -->
  <button>download all files</button>