我在这里指定了一个非常类似的需求。

我需要有用户的浏览器手动启动下载时$('a#someID').click();

但是我不能用窗户。Href方法,因为它将当前页面内容替换为您试图下载的文件。

相反,我想在新窗口/标签中打开下载。这怎么可能呢?


当前回答

我最终使用了下面的代码片段,它可以在大多数浏览器中运行,但没有在IE中进行测试。

let data = JSON.stringify([{email: "test@domain.com", name: "test"}, {email: "anothertest@example.com", name: "anothertest"}]); let type = "application/json", name = "testfile.json"; downloader(data, type, name) function downloader(data, type, name) { let blob = new Blob([data], {type}); let url = window.URL.createObjectURL(blob); downloadURI(url, name); window.URL.revokeObjectURL(url); } function downloadURI(uri, name) { let link = document.createElement("a"); link.download = name; link.href = uri; link.click(); }

更新

function downloadURI(uri, name) {
    let link = document.createElement("a");
    link.download = name;
    link.href = uri;
    link.click();
}

function downloader(data, type, name) {
    let blob = new Blob([data], {type});
    let url = window.URL.createObjectURL(blob);
    downloadURI(url, name);
    window.URL.revokeObjectURL(url);
}

其他回答

我使用@ rakfaraway的解决方案而不使用JQuery(因为在这里不需要它)。谢谢你的建议!下面是一个香草ajs基于表单的解决方案:

const uri = 'https://upload.wikimedia.org/wikipedia/commons/b/bb/Test_ogg_mp3_48kbps.wav'; let form = document.createElement("form"); 的形式。setAttribute(‘行动’,uri); document.body.appendChild(形式); form.submit (); document.body.removeChild (document.body.lastElementChild);

使用锚标签和PHP它可以做到,检查这个答案

JQuery Ajax调用PDF文件下载

HTML
    <a href="www.example.com/download_file.php?file_source=example.pdf">Download pdf here</a>

PHP
<?php
$fullPath = $_GET['fileSource'];
if($fullPath) {
    $fsize = filesize($fullPath);
    $path_parts = pathinfo($fullPath);
    $ext = strtolower($path_parts["extension"]);
    switch ($ext) {
        case "pdf":
        header("Content-Disposition: attachment; filename=\"".$path_parts["basename"]."\""); // use 'attachment' to force a download
        header("Content-type: application/pdf"); // add here more headers for diff. extensions
        break;
        default;
        header("Content-type: application/octet-stream");
        header("Content-Disposition: filename=\"".$path_parts["basename"]."\"");
    }
    if($fsize) {//checking if file size exist
      header("Content-length: $fsize");
    }
    readfile($fullPath);
    exit;
}
?>

我正在检查文件大小,因为如果你从CDN cloudfront加载pdf,你不会得到文档的大小,这迫使文档下载为0kb,为了避免这种情况,我正在检查这种情况

 if($fsize) {//checking if file size exist
      header("Content-length: $fsize");
    }
let args = {"data":htmlData,"filename":exampleName}

创建HTMl文件并下载

window.downloadHTML = function(args) {
var data, filename, link;
var csv = args.data;
if (csv == null) return;
filename = args.filename || 'report.html';
data = 'data:text/html;charset=utf-8,' + encodeURIComponent(csv);
console.log(data);
link = document.createElement('a');
link.setAttribute('href', data);
link.setAttribute('download', filename);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);}

创建并下载CSV文件

window.downloadCSV = function(args) {
var data, filename, link;
var csv = args.data;
if (csv == null) return;
filename = args.filename || 'report.csv';
if (!csv.match(/^data:text\/csv/i)) {
    csv = 'data:text/csv;charset=utf-8,' + csv;
}
data = encodeURI(csv);
link = document.createElement('a');
link.setAttribute('href', data);
link.setAttribute('download', filename);
document.body.appendChild(link);
link.click();
document.body.removeChild(link);

}

也许只是让你的javascript打开一个只下载文件的页面,比如当你把一个下载链接拖到一个新选项卡:

Window.open("https://www.MyServer.
Org/downloads/ardiuno/WgiWho=?:8080")

打开窗口,打开一个自动关闭的下载页面。

我建议使用下载属性而不是jQuery:

<a href="your_link" download> file_name </a>

这将下载您的文件,而不需要打开它。