chrome实现下载文件JS代码弹出'另存为'窗口
1.TXT类型文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<script>
function fake_click(obj) {
var ev = document.createEvent("MouseEvents");
ev.initMouseEvent(
"click", true, false, window, 0, 0, 0, 0, 0
, false, false, false, false, 0, null
);
obj.dispatchEvent(ev);
}
function myExport(name, data) {
var urlObject = window.URL || window.webkitURL || window;
// 有效的命名空间URI
// HTML - 参阅 http://www.w3.org/1999/xhtml
// SVG - 参阅 http://www.w3.org/2000/svg
// XBL - 参阅 http://www.mozilla.org/xbl
// XUL - 参阅 http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul
var myFile = new Blob([data]);
var save_link = document.createElementNS("http://www.w3.org/1999/xhtml", "a");
save_link.href = urlObject.createObjectURL(myFile);
save_link.download = name;
fake_click(save_link);
}
myExport('filename.xlsx', "helloworld!");
</script>
</body>
</html>
2.表格保存弹出另存为框
fake_click(obj) {
var ev = document.createEvent('MouseEvents')
ev.initMouseEvent(
'click',
true,
false,
window,
0,
0,
0,
0,
0,
false,
false,
false,
false,
0,
null
)
obj.dispatchEvent(ev)
},
// 测试代码-测试使用打开另存为窗口
myTestT() {
// Blob 格式 Excel 文件下载export
console.log('123456')
let url = 'http://10.10.10.22/aa/ddd/myExcel.xlsx'
axios
.get(url, {
responseType: 'blob',
params: {}
})
.then(res => {
// res.data 是一个 blob 流格式
var myFile = new Blob([res.data])
var save_link = document.createElementNS(
'http://www.w3.org/1999/xhtml',
'a'
)
var urlObject = window.URL || window.webkitURL || window
save_link.href = urlObject.createObjectURL(myFile)
// 要么就让用户手动加.xlsx,要么就没有另存为窗口
// save_link.download = 'myExcel.xlsx' // 如果这里不写.xlsx就可以打开另存为按钮
save_link.download = 'myExcel'
this.fake_click(save_link)
})
},
myExport(name, data) {
var urlObject = window.URL || window.webkitURL || window
// 有效的命名空间URI
// HTML - 参阅 http://www.w3.org/1999/xhtml
// SVG - 参阅 http://www.w3.org/2000/svg
// XBL - 参阅 http://www.mozilla.org/xbl
// XUL - 参阅 http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul
var myFile = new Blob([data])
var save_link = document.createElementNS(
'http://www.w3.org/1999/xhtml',
'a'
)
save_link.href = urlObject.createObjectURL(myFile)
save_link.download = name
this.fake_click(save_link)
},
// 测试代码-测试使用打开另存为窗口
下一个方法: 设置A标签,src直接对应一个可以下载的链接,以及download 可以用户右键另存为
最靠谱的方法: 使用a标签,添加download属性,然后让用户设置浏览器-高级-每次下载前询问另存为
chrome实现下载文件JS代码弹出'另存为'窗口的更多相关文章
- JS设置弹出小窗口。
经常上网的朋友可能会到过这样一些网站,一进入首页立刻会弹出一个窗口,或者按一个连接或按钮弹出,通常在这个窗口里会显示一些注意事项.版权信息.警告.欢迎光顾之类的话或者作者想要特别提示的信息.其实制作这 ...
- asp.net下用js实现弹出子窗口选定值并返回
对应上一篇博客代码: 父页面: <head runat="server"> <meta http-equiv="X-UA-Compatible" ...
- 【Java】数据库查询的数据直接以指定文件类型下载到本地(弹出下载框)
欲实现的功能目标:当点击下图的导出数据文件时弹出文件下载框,默认csv格式,用户自定义下载的本地路径 遇到的问题: 1.项目之前做过一次下载,但是是使用了本地文件模板.用输入流读取文件模板,插入数据, ...
- JS弹出模态窗口下拉列表特效
效果体验:http://hovertree.com/texiao/js/20/ 或者扫描二维码在手机体验: 点击选择城市后,在弹出的层中的输入框,输入英文字母 h,会有HoverTree和Hewenq ...
- [转]js来弹出窗口的详细说明
1.警告对话框 <script> alert("警告文字") </script> 2.确认对话框 <script> confirm(" ...
- js插件---弹出层sweetalert2(总结)
js插件---弹出层sweetalert2(总结) 一.总结 一句话总结: sweetalert2的效果非常好,效果比较Q萌,移动端适配也比较好,感觉比layer.js效果好点 1.SweetAler ...
- js自定义弹出框
js自定义弹出框: 代码如下 <html> <head><title>自定义弹出对话框</title> <style type ="te ...
- JS 弹出模态窗口解决方案
最近在项目中使用弹出模态窗口,功能要求: (1)模态窗口选择项目 (2)支持选择返回事件处理 在IE中有showModalDialog 方法,可以很好的解决该问题,但是在Chrome中和FF中就有问题 ...
- js实现第一次打开网页弹出指定窗口(常用功能封装很好用)
js实现第一次打开网页弹出指定窗口(常用功能封装很好用) 一.总结 1.常用功能封装:之前封装的cookie的操作函数非常好用,我自己也可以这么搞 二.js实现第一次打开网页弹出指定窗口 练习1:第一 ...
随机推荐
- LcdTools如何使用PX01进行EDP屏EDID比对及设置显示EDID比对结果
PX01点EDP屏在上电过程会自动读取屏EDID,那怎么进行EDID比对呢? LcdTools打开点屏工程,在上电时序函数中先用SetCmpEDID()指令设置EDID比对值,再调用CheckEDID ...
- 一篇文章带你了解服务器操作系统——Linux简单入门
一篇文章带你了解服务器操作系统--Linux简单入门 Linux作为服务器的常用操作系统,身为工作人员自然是要有所了解的 在本篇中我们会简单介绍Linux的特点,安装,相关指令使用以及内部程序的安装等 ...
- jQuery+bootstrap实现有省略号的数据分页
1.前言 在前端通过ajax请求数据后,可以通过bootstrap实现分页.由于bootstrap只提供分页的按钮的样式.数据分页我们需要实现页码跳转,上一页下一页,数据过多显示省略号,点击省略号能快 ...
- 【JVM】关于JVM,你需要掌握这些 | 一文彻底吃透JVM系列
写在前面 最近,一直有小伙伴让我整理下关于JVM的知识,经过十几天的收集与整理,初版算是整理出来了.希望对大家有所帮助. JDK 是什么? JDK 是用于支持 Java 程序开发的最小环境. Java ...
- "xxx cannot be cast to jakarta.servlet.Servlet "报错解决方式
在做jsp的上机时候同学出现了一个500错误:com.kailong.servlet.ComputeBill cannot be cast to jaka.servlet.Servlet 然后因为我用 ...
- JS数据结构与算法-栈结构
一.认识栈结构 栈也是一种非常常见的数据结构,并且在程序中的应用非常广泛 数组 我们知道数组是一种线性结构,并且可以在数组的任意位置插入和删除数据. 但是有时候,我们为了实现某些功能,必须对这种任意性 ...
- mindxdl--common--http_handler.go
// Copyright (c) 2021. Huawei Technologies Co., Ltd. All rights reserved.// Package common this file ...
- 【云原生 · DevOps】DevOps 解决方案
DevOps 解决方案 1.1 容器化 CI/CD 1.2 容器化流水线 1.3 深度集成 Jenkins 1.4 灰度发布 1.5 制品库设计 1.6 DevOps 安全 1.6.1 CI/CD 安 ...
- 【Java并发006】使用层面:Lock锁机制全解析
一.前言 二.synchronized局限性 + Lock锁机制的引入 2.1 synchronized局限性 第一,使用synchronized,其他线程只能等待直到持有锁的线程执行完释放锁(syn ...
- JavaScript入门①-基础知识筑基
01.JavaScript基础知识 JavaScript(缩写:JS)是一种具有面向对象能力的.解释型的程序语言,基于对象和事件驱动,具有相对安全性的客户端脚本语言.JavaScript是一门完备的 ...