a标签实现单文件和多文件下载

a标签实现单文件和多文件下载

最近的项目需要做单文件下载和多文件下载,经过努力终于实现了,想把实现的方法记录一下,分享给大家,希望对你有所帮助

这里写图片描述

单文件下载

单个的文件下载只需要使用a标签将文件目标放在href中,然后添加download属性。

download 属性规定被下载的超链接目标。

在a标签中必须设置 href 属性。

该属性也可以设置一个值来规定下载文件的名称。所允许的值没有限制,浏览器将自动检测正确的文件扩展名并添加到文件 (.img, .pdf, .txt, .html, 等等)。

<a href="文件目标"  download="自定义下载文件的名称"></a>

多文件下载

创建a标签模拟点击事件

downloadMulti (name, url) {
        var aDom = document.createElement('a')
        var evt = document.createEvent('HTMLEvents')
        evt.initEvent('click', false, false)
        aDom.download = name
        aDom.href = '/file/download?file_path=' + url
        aDom.dispatchEvent(evt)
        aDom.click()
      },

其中/file/download?file_path= 是后台写的一个服务,只需要把链接拼好赋值给a标签的href。然后调用 downloadMulti (name, url) 将文件名和链接传入就OK了

评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值