首页 > 其他分享 >js使用a标签下载文件并指定名称

js使用a标签下载文件并指定名称

时间:2024-03-01 10:46:16浏览次数:19  
标签:const Name 标签 js 名称 ShowUrl 下载

当使用js下载路径带有xxxxx.png 的路径图片时,下载下来的名称一直是xxxxx.png,有时候又需要指定文件名称,代码如下

 downFile(ShowUrl,Name) { // ShowUrl 表示路径  Name 表示需要的名称
    const x = new window.XMLHttpRequest();
    x.open('GET', ShowUrl, true);
    x.responseType = 'blob';
    x.onload = () => {
        const url = window.URL.createObjectURL(x.response);
        const a = document.createElement('a');
        a.href = url;
        a.target = '_blank'
        a.download = Name;
        a.style.display = 'none'
        document.body.append(a)
        a.click();
    };
    x.send();
},

  

标签:const,Name,标签,js,名称,ShowUrl,下载
From: https://www.cnblogs.com/fanjlqinl/p/18046446

相关文章

  • img标签 为何每个都要设置 draggable = false?
    dragable:默认值为false,可以用于拖拽,但是一个虚拟的。a标签,img标签默认自带拖拽,(只有chrome,safari可以使用,firefox不支持,ie不支持)在HTML5中,img标签默认是可拖动的(至少在某些浏览器如Chrome和Safari中)。当用户尝试拖动图片时,浏览器会根据其默认行为进行处理,例如可能会启动一......
  • 软考高级信息系统项目管理师教程(第4版)PDF下载
    《信息系统项目管理师教程》(第4版)是由全国计算机专业技术资格考试办公室组织编写的考试用书,根据2022年审定通过的《信息系统项目管理师考试大纲》编写,对信息系统项目管理师岗位所要求的主要知识及应用技术进行了阐述。《信息系统项目管理师教程》(第4版)主要内容包括:信息化发展、信......
  • 氢桌面【高德悬浮版】—更轻、更简洁的车载桌面【附带安装包下载地址】
    简介今天给大家推荐一款超好用的桌面【氢桌面】,支持4种首页布局方式,可根据自己喜好选择。支持开启小白点,非首页界面可以快速返回首页。如果用过CarPlay的车友会发现这个界面和CarPlay高度相似,中间显示地图小窗,右侧显示快捷导航天气音乐等界面。界面预览常见问题及方控设置......
  • JS/Vue 学习小记
    可能要写点轮子。。。先学学前端知识吧,记录一下。遍历:for(letiofS){i...}for(letiinS){S[i]...}JS是弱类型的语言。目前感觉到的特性有:数组不同元素可以是不同类型的函数返回值不需要声明,直接functionF()就可以JS中对象用大括号表示,成员可以是各种类型,包......
  • SiteServer CMS远程模板下载getshell漏洞导致的黑SEO利用分析溯源
    前言某日中午,涉及一代理商客户网站发现异常SQ内容,要求进行溯源分析并找出根本原因。0x01初步分析通过提供的链接(www.xxx.com.cn/2023j19tPLKn2/55151),确认涉及黑帽SEO活动,通过百度搜索进一步验证也证实了这一点。0x02日志分析黑客常常在植入菠菜或非法广告的网站中设置后......
  • Nest.js 大文件分片上传
    文件上传是常见需求,只要指定content-type为multipart/form-data,内容就会以如下图这种形式传递到服务端:服务端再按照multipart/form-data的格式提取数据,就能达到其中的文件。 但是当文件很大的时候,事情变得不一样了假设传一个100M的文件需要三分钟,那么传1G的文件就需要30......
  • Scratch全套Q版三国人物角色素材包免费下载
    全新Q版三国人物角色素材包,内含142张细腻可爱的Q版风格图片,涵盖三国名将、士兵、场景等丰富元素,为scratch爱好者提供多样选择,适合各类三国主题创作。免费下载:www.xiaohujing.com.cn(小虎鲸Scratch资源站~搜Q版三国)......
  • Vue Router系列之(八)router-link 标签的replace属性
    <router-link>的replace属性作用:控制路由跳转时操作浏览器历史记录的模式浏览器的历史记录有两种写入方式:分别为push和replace,push是追加历史记录,不破坏栈中的任何一条数据,不断的压入数据,replace是替换掉当前栈顶的那一条记录。路由跳转时候默认为push注:浏览器的历史记录实......
  • 记账本jsp
     <%@pagecontentType="text/html;charset=UTF-8"language="java"%><!DOCTYPEhtml> <html><head><metacharset="UTF-8"> <title>家庭记账本主页</title> <!--采用绝对路径导入css文件--> <linkrel=&......
  • jsp自定义标签
    一、自定义标签的作用自定义标签主要用于移除Jsp页面中的java代码。二、自定义标签开发和使用2.1、自定义标签开发步骤1、编写一个实现Tag接口的Java类(标签处理器类)1packageme.gacl.web.tag;23importjava.io.IOException;45importjavax.servl......