html5 - Downloading multiple files with a data URI -

i know how setup href , download attribute on anchor allow user download data file.

however, client has requested 1 link download 2 files , not zipped! don't ask me why!

looking online found following solutions:

1) create 2 iframes on fly , in each's form set location of 1 of files on server, run form submit...here

2) variation of (1) using jquery plugin..here

3) opening popup windows. (not worth link)

i'm wondering if can handle on js side? in same app, i'm exporting data csv following code:

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

where _str flattened 2 dimensional array.

can somehow trail or attach second file that?

you can create links on fly , fire navite click event.

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')]      ]); }); 

here can find fiddle working demo.

here article on web site details