颖想家

单个文件下载

在<a>标签添加了一个 download 的属性，download 的属性值是可选的，它用来指定下载文件的文件名。我们可以轻易的利用它来实现下载功能。

代码如下：<a href="filename.zip" download="filename.zip">Download file</a>

js批量下载多个文件

思路：将要下载文件的 url 放在一个数组里，循环数组并触发下载，代码如下：

var files = ['url1', 'url2'];

function batchDown(files)

{

    files.forEach(url => {

        if (this.isIE()) { // IE

            window.open(url, '_blank');

        } else {

            let a = document.createElement('a'); // 创建a标签

            let e = document.createEvent('MouseEvents'); // 创建鼠标事件对象

            e.initEvent('click', false, false); // 初始化事件对象

            a.href = url; // 设置下载地址

            a.download = ''; // 设置下载文件名

            a.dispatchEvent(e);

        }

    })

}

function isIE(){

    if (!!window.ActiveXObject || 'ActiveXObject' in window) {

        return true;

    } else {

        return false;

    }

}

2020年4月9日修改：

在测试的时候因为文件比较少，可以正常下载。但在实际生产中，发现js批量下载最多总共只能下载10个文件，其他的没法下载下来。

在网上搜索相关资料后，在batchDown函数中加一个有间隔的定时器就，间隔时间取100*index，这样就可以下载更多的文件了。修改后的代码如下：

function batchDown(files) {

    files.forEach(function(item, index) {

        setTimeout(()=>{

            if (this.isIE()) { // IE

                // window.open(url, '_blank');

            } else {

                    let a = document.createElement('a'); // 创建a标签

                    let e = document.createEvent('MouseEvents'); // 创建鼠标事件对象

                    e.initEvent('click', false, false); // 初始化事件对象

                    a.href = item; // 设置下载地址

                    a.download = ''; // 设置下载文件名

                    a.dispatchEvent(e);

                }

            },1000 * index)

        })

}

Navicat for MySQL V11.0.10 绿色破解版下载地址

链接: https://pan.baidu.com/s/1QDlVYdCrqZ6x2wIEriGStQ 提取码: njfd