1 循环下载

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$("body").on('click', '#batch-download', function () {
var checkedbox = $(".file_url:checked");
if (checkedbox.length == 0) {
alert('请选择要下载的数据');
return false;
}

checkedbox.each(function (index, item) {
const path = $(this).val();
var a = document.createElement('a');//在dom树上创建一个a标签
let url = url
a.href = url;//将url赋值给a标签的href属性
a.download = id;//设置设置下载文件的名称
a.click();//主动触发a标签点击事件
})

return false;
})

这种方案每次只能下载最后一个,每次循环执行,都会覆盖上一次的时间,如果像保存每次循环的状态,那么,需要使用闭包:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
$("body").on('click', '#batch-download', function () {
var checkedbox = $(".file_url:checked");
if (checkedbox.length == 0) {
alert('请选择要下载的数据');
return false;
}

checkedbox.each(function (index, item) {
const path = $(this).val();
var timer1 = setTimeout(function (path) {
return function () {
//定义一个看不见的iframe
var iframe = $("<iframe class='downloadIfream' src='" + path + "' style='height:0;display:none'></iframe>")
$("body").append(iframe)
var timer2 = setTimeout(function () {
iframe.remove()
clearTimeout(timer2)
}, 5000) //这个就根据实际情况定义一下延时删除添加的iframe,不删除也问题不大
clearTimeout(timer1)
}
}(path), 1000 * index) //每隔1s插入一个iframe

})

return false;
})

单个文件下载:

a标签 模拟点击事件

1
2
window.location.href = 下载接口地址
window.open(“下载接口地址”)

都可以实现,比较简单

Reference

写在最后

欢迎大家关注鄙人的公众号【麦田里的守望者zhg】,让我们一起成长,谢谢。
微信公众号