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

说明:下载图片和文档资料是两种不同的方式,所以需要先判断下载的是图片还是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.mzph.cn/news/584316.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Delphi套接字库:构建高效网络应用的利器

在Delphi编程语言中,套接字库(Socket Library)是一个关键的组成部分,为开发者提供了在网络环境下构建高效应用的强大工具。套接字库通过简化网络通信的复杂性,使得开发者能够轻松地实现客户端和服务器之间的数据传输&a…

如何使用Spoofy检测目标域名是否存在欺骗攻击风险

关于Spoofy Spoofy是一款功能强大的域名安全检测工具,在该工具的帮助下,广大研究人员可以轻松检测单个目标域名或域名列表中的域名是否存在遭受欺诈攻击的风险。 该工具基于纯Python开发,可以根据SPF和DMARC记录来检测和判断目标域名是否可…

C++ 类和对象 (上)

类的引入: 由于C语言是面向过程的编程语言,我们在完成一件事的时候通常习惯将一件事拆分成一个一个小过程来实现,而到了C就习惯将一件事分成不同的模块,交给不同的对象来处理,每一个对象中承载着数据类型和函数。 &am…

Jackson进行Json反序列化对于一个小写字母开头后跟大写字母无法识别反序列成功问题

问题描述 json数据:{“pTargetId”:“123”} javaBean: Datapublic static class Test {private String pTargetId;}运行下面代码: public static void main(String[] args) throws JsonProcessingException {String json "{\"pT…

We are a team - 华为OD统一考试

OD统一考试 题解&#xff1a; Java / Python / C 题目描述 总共有 n 个人在机房&#xff0c;每个人有一个标号 (1<标号<n) &#xff0c;他们分成了多个团队&#xff0c;需要你根据收到的 m 条消息判定指定的两个人是否在一个团队中&#xff0c;具体的: 消息构成为 a b …

智慧启航:机场管理系统的革新与飞机航天展馆的视觉盛宴

随着科技的飞速发展&#xff0c;我们的生活方式正在不断地被改变和提升。而在航空领域&#xff0c;这种变化则更加明显。从机场的智慧管理系统大屏&#xff0c;到飞机航天展馆的三维可视化&#xff0c;再到飞机涡轮发动机的3D模型&#xff0c;科技的力量正在带我们进入一个前所…

ArkUI按钮组件深入学习:通过点击按钮实现图片大小调整效果

文章目录 前言Button组件控制 Button 样式实现点击按钮改变图片大小文章总结技术回顾前言 在前面几节课中,我们已经学习了 ArkUI 提供的一些常见组件,通过一个小案例实现了 image text 和 text input 组件的使用。我们成功地让用户通过输入来改变图片的宽度,从而实现了一个…

bat命令清理Window应用注册表(Unity开发Window应用)

bat命令清理Window应用注册表&#xff08;Unity开发Window应用&#xff09; 介绍出现的问题方案一方案二方案二解决方案1. 首先使用【Win】【R】组合快捷键&#xff0c;快速打开运行命令框&#xff0c;在打开后面键入命令&#xff1a;【Regedit】2. 完后后按回车键&#xff08;…

(一)window使用VMware运行Centos7

前言&#xff1a;为了学习微服务环境搭建&#xff0c;需要自己重新弄一套linux环境&#xff0c;捡起几年前使用VMware虚拟机运行linux的知识。。。不想买云盘&#xff0c;好贵 一、下载安装包 WMware安装包下载 附赠一个破解码&#xff1a;JU090-6039P-08409-8J0QH-2YR7F 如…

【Unity美术】Unity工程师对3D模型需要达到的了解【一】

&#x1f468;‍&#x1f4bb;个人主页&#xff1a;元宇宙-秩沅 &#x1f468;‍&#x1f4bb; hallo 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍&#x1f4bb; 本文由 秩沅 原创 &#x1f468;‍&#x1f4bb; 收录于专栏&#xff1a;Uni…

C语言,指针链表详解解说及代码示例

C语言&#xff0c;指针链表详解解说及代码示例 指针链表是一种常用的数据结构&#xff0c;用于存储和组织数据。它由一系列节点组成&#xff0c;每个节点包含数据和一个指向下一个节点的指针。通过这种方式&#xff0c;可以动态地添加、删除和访问节点&#xff0c;实现灵活的数…

探索微软Edge:使用方法和心得分享

学习目标&#xff1a; 了解微软Edge的基本功能和使用方法。掌握在微软Edge上进行浏览、搜索和书签管理的技巧。学习如何使用微软Edge进行隐私和安全管理。探索微软Edge的扩展和其他高级功能。 学习内容&#xff1a; 微软Edge的简介&#xff1a;了解微软Edge的起源、特点和与其…

需求:多笔流水的金额分配给多个订单,确保流水总金额和订单总金额一致

&#x1f4da;目录 需求业务解释解决代码效果 需求 按照一定规则将多笔流水的金额分配给多个订单&#xff0c;确保流水总金额和订单总金额一致。 业务解释 之前系统做了个功能&#xff0c;允许对订单进行录错退款&#xff0c;并且重新关联新的订单&#xff0c;审核通过完成后…

logback1.2.3版本中日志文件时间自定义

假如在logback配置文件中存在以下配置 <appender name"custom_log_file" class"ch.qos.logback.core.rolling.RollingFileAppender"><rollingPolicy class"ch.qos.logback.core.rolling.TimeBasedRollingPolicy"><fileNamePatter…

逻辑卷学习

磁盘分区的缺点 1.无法扩容 2.必须使用的空间 3.没有备份: 一、逻辑卷的定义 LVM 是 Logical Volume Manager 的简称&#xff0c;译为中文就是逻辑卷管理。它是 Linux 下对硬盘分区的一种管理机制。LVM 适合于管理大存储设备&#xff0c;并允许用户动态调整文件系统的大小…

macOS编译ckb-next

macOS x86 成功&#xff0c;下一步&#xff0c;测试&#xff1a;m1、m2、m3 。 1、Homebrew # 三选一 /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)" # /bin/bash -c "$(curl -fsSL https://raw.gith…

Android Camera相关类功能整理

1.Camera Java相关类 代码目录&#xff1a;frameworks/base/core/java/android/hardware/camera2/ CameraManager&#xff1a;camera系统服务管理类&#xff0c;用于监测、获取特征值和连接Camera设备。 CameraManager.CameraManagerGlobal:全局camera Manager实例&#xff…

Python 中的异常处理

Python 中的异常处理(Exceptions Handling in Python) 文章目录 Python 中的异常处理(Exceptions Handling in Python)Introduction 导言Python 中的异常处理结构 Exceptions Handling Structure in Python为什么我们需要 Finally 块&#xff1f; Introduction 导言 在编程过程…

PicGo+GitHub搭建免费图床

PicGoGitHub搭建免费图床 步骤 1: 安装 PicGo步骤 2:创建图床仓库步骤 3: 配置 GitHub Token步骤 4: 配置 PicGo步骤 5: 上传图片步骤 6: 访问图片 使用 GitHub 作为图床的优势在于免费、稳定且具有版本控制功能&#xff0c;特别适合个人博客、小型项目等。PicGo作为一个开源的…

Java注解之@Autowired,一文掌握@Autowired注解知识(3)

&#x1f3c6;作者简介&#xff0c;普修罗双战士&#xff0c;一直追求不断学习和成长&#xff0c;在技术的道路上持续探索和实践。 &#x1f3c6;多年互联网行业从业经验&#xff0c;历任核心研发工程师&#xff0c;项目技术负责人。 &#x1f389;欢迎 &#x1f44d;点赞✍评论…