精华内容
下载资源
问答
  • a标签的download属性
    2021-07-16 16:33:59

    直接放代码,大概功能是能将本地的文件放置页面供其他人下载

    参考模板请点击下载: <a href="/eg.xlsx" download="eg.xlsx" class="down">example.xlsx</a>
    
    • 将本地文件放在vue项目下的public里面,这点很重要,我之前放在了static目录下,硬是排了半天错,所以放在public目录下!!!
    更多相关内容
  • a标签download属性

    千次阅读 2020-04-14 17:14:31
    download属性是HTML5新增的属性,也就是作用在HTML5的基础之上,他可以使a标签的href属性进行下载,download属性为下载后的文件名 用法1:下载该本地图片,并默认命名 <a href="../../assets/img/213.png" download ...

    download属性是HTML5新增的属性,也就是作用在HTML5的基础之上,他可以使a标签的href属性进行下载,download属性为下载后的文件名

    用法1:下载该本地图片,并默认命名

    <a href="../../assets/img/213.png" download target="_blank"> 下载图片</a>
    

    用法2:下载该本地图片,并命名为img

    <a href="../../assets/img/213.png" download="img" target="_blank"> 下载图片</a>
    

    注意: href属性的地址必须是前端js非跨域的地址(限于同源文件),如果引用的是第三方的网站或者是调用后台的接口,这时download就会不起作用。

    在这种情况下如果你是下载浏览器无法解析的文件,例如.exe,.xlsx…那么浏览器也会自动下载,但是如果你使用浏览器可以解析的文件,比如.txt,.png…浏览器就会采取预览模式,所以无论如何你都无法直接弹出下载框。如下图所示:

    <a href="http://pengxi.honggv.cn:9099/image/5be411a7-0800-49a2-8e5b-866fc5c70b19.png" download="username" target="_blank"> 下载</a>
    

    在这里插入图片描述
    所以如果真的出现上述情况,那么只有一种办法,提示用户进行手动的右键保存。
    参考:https://blog.csdn.net/zgjsxzlx/article/details/86543022

    另一种解决方案是通过后台修改配置.
    参考:https://www.cnblogs.com/liujiacai/p/11732654.html

    展开全文
  • Html a标签 download属性失效原因

    千次阅读 2021-06-11 08:06:53
    HTML 4.01 与 HTML 5 之间的差异在 HTML5 中,download 属性标签的新属性。因此,download 是属于HTML5的新属性,失效原因分析如下:1、没有声明html5,需要再html文件头声明声明必须是 HTML 文档的第一行,位于 ...

    HTML 4.01 与 HTML 5 之间的差异

    在 HTML5 中,download 属性是 标签的新属性。

    因此,download 是属于HTML5的新属性,失效原因分析如下:

    1、没有声明html5,需要再html文件头声明

    声明必须是 HTML 文档的第一行,位于 标签之前。

    声明不是 HTML 标签;它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。

    在 HTML 4.01 中, 声明引用 DTD,因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则,这样浏览器才能正确地呈现内容。

    HTML5 不基于 SGML,所以不需要引用 DTD。

    提示:请始终向 HTML 文档添加 声明,这样浏览器才能获知文档类型。

    2、存在跨域问题,通过download 属性下载文件,必须为同一域名下

    3b4cd9fe70b8b41a01e1a965dad2b23c.png

    参考链接:

    https://segmentfault.com/q/1010000014555598?utm_source=index-hottest

    http://www.w3school.com.cn/tags/tag_doctype.asp

    http://www.w3school.com.cn/tags/att_a_download.asp

    展开全文
  • https://www.runoob.com/tags/att-a-download.html 一、实现下载 exportLeftMarketing(this.searchKeywords).then(res => { let blob = new Blob([res], {type: 'application/vnd.ms-excel'}) const link ...

    回顾

            HTML <a> download 属性 | 菜鸟教程

    一、实现下载

    exportLeftMarketing(this.searchKeywords).then(res => {
    
                  let blob = new Blob([res], {type: 'application/vnd.ms-excel'})
    
                  let num = ''
                  var d = new Date()
                  var year = d.getFullYear()
                  var month = d.getMonth()
                  var date = d.getDate()
                  var hours = d.getHours()
                  var minutes = d.getMinutes()
                  var seconds = d.getSeconds()
                  num += year + "" + month + "" + date + "" + hours + "" + minutes + "" + seconds
    
                  const link = document.createElement('a')
                  link.style.display = 'none'
                  link.href = URL.createObjectURL(blob)
                  link.setAttribute('download', 'info' + num + '.xlsx')
                  document.body.appendChild(link)
                  link.click()
                  document.body.removeChild(link)
              })

    二、Chrome与IE显示对比

            1.0 Chrome显示正常

                   

            2.0 IE无任何反应

    三、兼容IE

      exportLeftMarketing(this.searchKeywords).then(res => {
                  let blob = new Blob([res], {type: 'application/vnd.ms-excel'})
    
                  let num = ''
                  var d = new Date()
                  var year = d.getFullYear()
                  var month = d.getMonth()
                  var date = d.getDate()
                  var hours = d.getHours()
                  var minutes = d.getMinutes()
                  var seconds = d.getSeconds()
                  num += year + "" + month + "" + date + "" + hours + "" + minutes + "" + seconds
    
                  // IE
                  if (navigator.msSaveBlob) {
                    window.navigator.msSaveBlob(blob, 'info' + num + '.xlsx')
                    return        
                  }
                  // 或
                  if('msSaveOrOpenBlob' in navigator){
                    window.navigator.msSaveOrOpenBlob(blob, 'info' + num + '.xlsx');
                    return
                  } 
    
                  const link = document.createElement('a')
                  link.style.display = 'none'
                  link.href = URL.createObjectURL(blob)
                  link.setAttribute('download', 'info' + num + '.xlsx')
                  document.body.appendChild(link)
                  link.click()
                  document.body.removeChild(link)
              })

    四、重新渲染(Navigator.msSaveBlob - Web APIs | MDN

            

    展开全文
  • html中a标签download属性使用方法和介绍使用实例定义和用法语法浏览器支持 使用实例 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>奇葩天地网(qipa250.com)</...
  • a标签download属性不起作用

    万次阅读 多人点赞 2019-01-18 17:05:11
    a标签download属性不起作用 首先要明白的是,download属性是HTML5新增的属性,也就是作用在HTML5的基础之上,他可以使a标签的href属性进行下载,如果填写指就会更改你的下载名称,比如: <a href="/images/a....
  • a标签download属性修改文件名失效

    万次阅读 2018-10-17 16:08:43
    &lt;a href="'+fileurl+'" download="'+filename+'"&gt; fileName为下载文件要修改的名字 ...在谷歌和火狐浏览器a标签download属性修改文件名失效是因为网络原因:注意访...
  • a标签download属性可以更改下载文件的文件名。但是如果是跨域的话,download属性就会失效。 解决方案: <a click="downloadFile(fileUrl,fileName)">下载文件</a> function downloadFile(url, ...
  • a标签download属性修改文件名

    千次阅读 2020-01-16 14:57:20
    静态文件下载时,可通过downloads属性修改文件名,如下所述: ...注意事项:a标签download属性只支持谷歌和火狐浏览器,不支持IE(IE不支持html5 新特性a标签download属性)。同时访问的域名与a标签内href的域...
  • IE浏览器a标签无法下载问题解决(IE浏览器a标签download属性不兼容问题解决)
  • 问题描述:前段时间一直想使用前端的a标签实现文件下载,使用的a标签download属性就能实现。可是FTP服务器的图片还是一直只能预览无法直接下载。 #使用的地址是直接使用的IP端口的,原因就出在这里:当请求...
  • 在众多的方法中,通过 <a> 标签download 属性实现下载是其中常见也是比较简单的一种方法。 download 属性介绍 常规的 <a> 标签通过 href 实现链接跳转,如果只想下载文件而不是跳转预览,最好的方式是在 <a> 标签...
  • a 标签 download 属性不起作用,或者下载的图片无法查看 问题描述 downloada 标签 html5 的新属性,可以点击下载文件,初次使用,经常会出现无法点击的情况,可能有以下原因,排除下: 解决方案 必须设置 ...
  • download 属性 H5的新增属性 指定且只能指定,下载后的默认文件名字和文件后缀。注意,可以不指定后缀名,浏览器会根据数据类型自动为其匹配后缀名,但是最好指定后缀。 <a href="base64..." download="after...
  • 本文章只讨论a标签download属性的相关内容。关于页面实现下载功能的方法,另外开篇介绍。 download为h5中新增的a标签属性。download+herf使a标签具备点击下载功能。但其兼容性有局限性。 1、首先实现download功能...
  • 解决a标签download属性无效问题

    万次阅读 2019-05-21 12:01:50
    起初遇到这个问题是因为在QQ浏览器中,a链接无法下载浏览器插件(.crx文件),既没有弹出下载窗口,在下载记录里面也找不到下载文件,后面就给a标签添加了这个download属性download属性的作用是强制弹出下载窗口,...
  • 在谷歌和火狐浏览器a标签download属性修改文件名失效的原因:不同源,访问的域名和href的域名要一致。 解决方法: 使用HTML5 Blob实现文件下载,先把文件以bobl的形式下载到当前页面,再创建a标签。 <a click=...
  • 在使用a标签下载文件时,download属性可以更改下载的文件名,但是当a标签的下载链接跨域时,download属性将不会生效,原因是浏览器无法获取到文件,不能对他进行更改 解决办法 将文件使用get请求获取到,转为blob...
  • 在前端使用canvas的toDataURL方法生成base64数据,然后通过动态生成a标签并设置download属性和href属性实现下载 但是发现数据量太大时,a标签的href属性就不会生效,此时下载框会显示url为空 解决方案: 可以通过...
  • h5 中如果 a 标签url指向的 不是 同样域名 可能导致无法下载 或者 下载的 后缀不是自己想要的 怎么解决那 直接上代码 downFromOther(url, fileName){ var download = new XMLHttpRequest(); download.open("GET",...
  • 前端使用a标签download属性实现静态文件或图片下载 需要知道的是,如果下载的是浏览器不能识别的(例如:.exe,.zip,.doc等)内容,浏览器会直接进行下载,但是如果下载的是浏览器可以识别的(例如:.png,.jpg等)...
  • a标签download无效解决办法

    千次阅读 2021-07-01 15:25:50
    a标签download无效解决办法 在开发时遇到要下载附件的需求,当时想到直接a标签herf里填上链接不就行了么。结果发现当附件是txt或者jpg等,这种浏览器可以直接打开文件类型时,浏览器会直接打开,不会下载。 那我们...
  • "download" , url.name + '.png' ); document.body.appendChild(link); link.click(); } }; image.src = imgsrc; function dataURLtoBlob (dataurl) { var arr = dataurl.split( ',' ), mime = arr...
  • HTML--a--download-属性

    2021-09-23 00:04:08
    测试地址 <a href=...(1) 当 download 属性值不为空时,下载的文件的名字由 download属性值确定,扩展名分两种情况: ① download 中指定后缀名 <a href="150
  • href和download是我们下载文件所需要的两个属性: href:是指这个超链接指向的url地址; download:该属性是HTML5新增的属性,此属性是让我们的浏览器下载URL而不是跳转到URL所指向的内容,所以若我们需要下载文件...
  • ==============小记================= ...在谷歌和火狐浏览器a标签download属性修改文件名失效是因为网络原因:注意访问于域名和href的域名要一致 【注】最好在服务端将文件名、文件类型等属性定义好由前端调用 ...
  • a标签download属性可以更改下载文件的文件名。但是如果是跨域的话,download属性就会失效。 解决方案: //onclick 事件 <a @click="downloadFile(fileUrl,fileName)">下载文件</a> downloadFile...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 38,415
精华内容 15,366
关键字:

a标签的download属性