Question

我知道如何在锚点上设置href和下载属性，以允许用户将数据下载为文件。

但是，客户要求一个链接一起下载两个文件而不是压缩！不要问我为什么！

在线查看我发现了以下解决方案：

1）动态创建2个iframe，并在每个表单中将其GET设置为服务器上其中一个文件的位置，然后运行表单提交... here

2）（1）的变体使用JQuery插件.. here

3）打开弹出窗口。（不值得链接）

我想知道我是否可以在JS方面处理这个问题？在同一个应用程序中，我使用以下代码将数据导出为CSV：

$elm.attr('href', 'data:text/csv;charset=utf8,' + encodeURIComponent(_str)).attr('download', fileName);

其中_str是一个扁平的二维数组。

我可以以某种方式追踪或附加第二个文件吗？

Answer 1

您可以动态创建链接并触发导航点击事件。

function downloadAll(files){
    if(files.length == 0) return;
    file = files.pop();
    var theAnchor = $('<a />')
        .attr('href', file[1])
        .attr('download',file[0]);
    theAnchor[0].click(); 
    theAnchor.remove();
    downloadAll(files);
}

$('a.download-csv').on('click', function(){
    downloadAll([

        ['file1.csv', 'data:text/csv;charset=utf8,'+ 
                     encodeURIComponent('my,csv,file\and,so,on')],

        ['file2.csv', 'data:text/csv;charset=utf8,'+ 
                     encodeURIComponent('my,csv,file\and,so,on')],

        ['file3.csv', 'data:text/csv;charset=utf8,'+ 
                     encodeURIComponent('my,csv,file\and,so,on')]

    ]);
});

在这里，您可以找到fiddle的工作演示。

以下是包含所有详细信息的article on my web site

使用数据URI下载多个文件

1 个答案: