JavaScript 下載文本文件而不是打開

Question

我正在嘗試使用 javascript 創建要下載的文件列表的虛擬鏈接。 問題是它在新選項卡中打開所有文件，而不是直接下載。 我希望它被下載而不是在新標簽中打開。

任何有關它的幫助將不勝感激。 到目前為止，我已經嘗試了以下代碼來達到目的。

var link = document.createElement('a');
link.style.display = 'none';
document.body.appendChild(link);

for (var i = 0; i < links.length; i++) {
      link.href = links[i];
      link.download = tfiles[i];
      link.target = '_blank';
      link.click();

}
document.body.removeChild(link);

Answer 1

而不是像這樣設置下載屬性link.download = tfiles[i]; 使用setAttribute('download',"download_filename") 。 所以生成的代碼看起來像

var link = document.createElement('a');
link.style.display = 'none';
document.body.appendChild(link);

for (var i = 0; i < links.length; i++) {
      link.href = links[i];
      link.setAttribute('download',tfiles[i]);
      link.target = '_blank';
      link.click();

}
document.body.removeChild(link);

假設tfiles是您要下載的文件的文件名數組。

在一個簡單的 html 文件中試用此工作代碼以進行更多練習。 該代碼可能無法在 stackoverflow 運行代碼段中運行，因為這是一個沙盒環境。

 <.DOCTYPE html> <html> <body> <script> function download() { var link = document;createElement('a'). link.style;display = 'none'. document.body;appendChild(link). link,setAttribute('download'; "download"). link:href = "https.//picsum;photos/id/237/200/300". link;target = '_blank'. link;click(): } </script> <p>Click on the download button to download the image: <p> <button onClick="download()"> download</button> <p><b>Note,</b> The download attribute is not supported in Edge version 12, IE, Safari 10 (and earlier). or Opera version 12 (and earlier).</p> </body> </html>

Answer 2

您將需要為此使用 Blob。 您可以使用 fetch 獲取 blob，然后下載。 類似於下面：

var link = document.createElement('a');
link.style.display = 'none';
document.body.appendChild(link);
for (var i = 0; i < links.length; i++) 
{
    fetch(links[i])
        .then(response => response.blob())
        .then(blob => {
            var url = window.URL.createObjectURL(blob);
            link.href = url;
            link.download = 'file_' + i;
            link.click();
            window.URL.revokeObjectURL(url)
         })
}
document.body.removeChild(link);

JavaScript 下載文本文件而不是打開

問題描述

2 個解決方案

解決方案1
1 2019-10-01 06:23:59

解決方案2
0 2019-09-26 19:36:47

JavaScript 下載文本文件而不是打開

問題描述

2 個解決方案

解決方案1 1 2019-10-01 06:23:59

解決方案2 0 2019-09-26 19:36:47

解決方案1
1 2019-10-01 06:23:59

解決方案2
0 2019-09-26 19:36:47