js实现前端下载图片和文件资料

news/2024/7/8 3:51:30 标签: 前端, javascript, 开发语言

说明:下载图片和文档资料是两种不同的方式,所以需要先判断下载的是图片还是word,excel等文件资料

目录

1.文件资料下载:

2.图片资源下载


1.文件资料下载:

window.location.href = '文件路径';
handleClick(item) {
  let fileSrc = `../../../data/${item.filepath}/${item.xzfilename}`;
  let filename = item.filename;
  let imgtype = ['png','jpg','jpeg','PNG','JPG','JPEG'];
  if(imgtype.indexOf(item.filename.split('.')[1]) != -1){
    debugger;
    //图片类型下载方式
    this.saveFileImg(fileSrc,filename);
  }else{
    debugger;
    //文档类型
    window.location.href = fileSrc;
  }
},

2.图片资源下载

saveFileImg(data,filename){
    var save_link = document.createElementNS('http://www.w3.org/1999/xhtml', 'a');
    save_link.href = data;
    save_link.download = filename;
    var event = document.createEvent('MouseEvents');
    event.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
    save_link.dispatchEvent(event);
},


http://www.niftyadmin.cn/n/5294173.html

相关文章

JAVA:利用JUnit进行高效的单元测试

1、简述 在软件开发中,单元测试是确保代码质量和可维护性的关键步骤。JUnit作为Java领域最流行的单元测试框架之一,提供了简单而强大的测试工具,可以帮助开发者在项目开发过程中及时发现和修复代码中的问题。本文将介绍JUnit的基本用法以及一…

【Linux系统化学习】进程终止的奥秘

个人主页点击直达:小白不是程序媛 Linux专栏:Liunx系统化学习 代码仓库:Gitee 目录 获取函数返回值 退出码 进程退出的场景 错误码 信号终止异常代码 进程的终止 main函数直接return exit函数 _exit函数 获取函数返回值 在C语言学…

鸿蒙OS应用开发之气泡提示

前面学习了弹窗提示,其实有时候只是想在旁边做一些说明,那么采用弹窗的方式就比较麻烦一些,这时可以采用系统里面的气泡提示方式。 系统也提供了几种方式弹出气泡提示,最简单的一种是采用bindPopup属性。它的定义如下: 在后面的参数设置里,也是比较复杂的形式。我们先来演…

【PHP】函数array_intersect、array_diff:从数组中取出、去除指定的几个键值

1.从数组中取出 :array_intersect 要从数组中取出指定的几个键值,可以使用 array_intersect_key 函数。以下是一个示例: $array [name > John,age > 30,email > johnexample.com,city > New York ];$keys [name, email];$resu…

<limits.h> 头文件:限制和特性

引言 <limits.h>头文件提供了关于整数数据类型的各种限制和特性的信息。在本博客中&#xff0c;我们将深入探讨<limits.h>头文件的功能和用法&#xff0c;以便更好地理解和利用这一重要的标准库头文件。 了解<limits.h>的用途 <limits.h>头文件定义了…

网络攻击之-暴力破解/密码喷射流量告警运营分析篇

本文从暴力破解/密码喷射的定义,暴力破解/密码喷射的流量数据包示例,暴力破解/密码喷射的suricata规则,暴力破解/密码喷射的告警研判,暴力破解/密码喷射的处置建议等几个方面阐述如何通过IDS/NDR,态势感知等流量平台的暴力破解/密码喷射类型的告警的线索,开展日常安全运营…

ElasticSearch 架构设计

介绍 ElasticSearchMySQLIndexTableDocumentRowFieldColumnMappingSchemaQuery DSLSQLaggregationsgroup by&#xff0c;avg&#xff0c;sumcardinality去重 distinctreindex数据迁移 ElasticSearch 中的一个索引由一个或多个分片组成 每个分片包含多个 segment&#xff08;分…

Java八股文面试全套真题【含答案】- SpringCloud篇

以下是关于Java八股文面试全套真题- SpringCloud篇 1.什么是Spring Cloud&#xff1f; Spring Cloud是一个用于构建分布式系统的开发工具箱&#xff0c;它基于Spring Boot框架&#xff0c;提供了一系列的组件和工具&#xff0c;用于帮助开发者快速搭建和管理分布式系统中的各种…