web 另类方法实现“另存为”功能
HTML5 的 FileReader 带给我们很强大的文件只读访问能力,可是在 HTML5 新增的 JS 中却没有发现有方便的另存到本地文件的相关 API,以往的办法要么调用浏览器的 save as 命令(兼容程度不详),要么将内容提交到服务器,由服务器附加 content-type: application/octet-stream 头并原文打回来实现。
偶然间,发现 HTML5 的 <a> 标签有了一个新属性,叫 download,取值是一个文件名,当一个带有 download 属性的 <a> 链接被点击时,其形为不再是一个网页跳转,而变成将目标以指定的文件名另存到本地,兼容性还不错的样子。
可是你想啊,<a> 的 href 值是可以随便改的,也就是说要另存的文件内容可以通过 JS 的方式轻松生成,对其指定一个 datauri 就可以决定要保存的文件内容了,配合 base64,甚至可以产生一个二进制文件!
原理简单,实现无比容易,就不在这儿贴代码了,戳我可以看看 live demo。
web 另类方法实现“另存为”功能的更多相关文章
- web手工项目02-注册功能输入分析,处理,输出方法-测试用例及缺陷编写-首页轮播图和购物车
web手工项目第二天笔记 昨日回顾 搭建测试环境(WAMP,phpStudy,tpshop项目文件) 熟悉项目(四个步骤,三个来源) 项目测试流程(需求评审,测试计划与方案,测试用例设计与评审,测试执 ...
- 另类方法解决设计Web页面出现:Error Creating Control
在B/S开发的过程中,经常会遇到这样的提示:Error Creating Control ,而这些页面明明之前是可以打开的,但还是出现如下图所示: 网上找到的方法是把控件初始化放在OnInit里去写, ...
- 解密SuperWebview的一种另类方法
解密SuperWebview的一种另类方法 什么是SuperWebview SuperWebview是APICloud官方推出的另一项重量级API生态产品,以SDK方式提供,致力于提升和改善移动设备W ...
- Visual Studio 2010 实用功能:使用web.config发布文件替换功能
当建立ASP.NET Web应用程序项目后,默认除了生成web.config外,还生成了web.debug.config与Web.Release.config.顾名思义,根据它们的命名我可以推测到他们 ...
- (转) Tomcat部署Web应用方法总结
原文:http://blog.csdn.net/yangxueyong/article/details/6130065 Tomcat部署Web应用方法总结 分类: Java web2011-01-11 ...
- 实现Web上的用户登录功能
关于如何实现web上的自动登录功能 文章来源http://coolshell.cn/articles/5353.html Web上的用户登录功能应该是最基本的功能了,可是在我看过一些站点的用户登录功能 ...
- Tomcat部署Web应用方法总结
转载:http://m.blog.csdn.net/blog/u012516903/15741727 Tomcat部署Web应用方法总结 在Tomcat中部署Java Web应用程序有两种方式:静态部 ...
- 你会做Web上的用户登录功能吗?
Web上的用户登录功能应该是最基本的功能了,可是在我看过一些站点的用户登录功能后,我觉得很有必要写一篇文章教大家怎么来做用户登录功能.下面的文章告诉大家这个功能可能并没有你所想像的那么简单,这是一个关 ...
- 解决 SQL 注入的另类方法
本文是翻译,版权归原作者所有 原文地址(original source):https://bitcoinrevolt.wordpress.com/2016/03/08/solving-the-prob ...
随机推荐
- 正则工具类以及FinalClass
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/jadyer/article/details/27811103 完整版见https://jadyer. ...
- 【转】【录教程必备】推荐几款屏幕录制工具(可录制GIF)
我们经常会遇到一些场景,需要你向别人展示一些操作或是效果——例如告诉别人某某软件的配置步骤啊.刚设计出来网站的动画效果怎么样啊.某某电影里面的一个镜头多么经典啊.打得大快人心的NBA绝杀瞬间是怎么回事 ...
- HDU 6113 度度熊的01世界 【DFS】(2017"百度之星"程序设计大赛 - 初赛(A))
度度熊的01世界 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Su ...
- myeclipse -vmargs -Xmx512m -XX:MaxPermSize=256m -XX:ReservedCodeCacheSize=64m
myeclipse.ini把里面的参数为 -vmargs -Xmx512m -XX:MaxPermSize=256m -XX:ReservedCodeCacheSize=64m 以对于我而言,我只要把 ...
- js-easyUI格式化时间
formatter : function(value, row) { if(value != null){ var date = new Date(value); var y = date.getFu ...
- Mac JDK 多版本共存
1. 安装各JDK版本,安装后通过Java -version检测是否安装好 2. 打开~/.bash_profile,没有的话创建 vim ~/.bash_profile ...
- webpack 的编译原理
自从接触了react,vue 这两个框架,都会用到webpack这个打包工具.面试的时候,经常被问到知道webpack的编译原理吗? 可以简单的介绍一下.每每这个时候都被问的哑口无言,平时用的时候挺顺 ...
- ZOJ3469 Food Delivery —— 区间DP
题目链接:https://vjudge.net/problem/ZOJ-3469 Food Delivery Time Limit: 2 Seconds Memory Limit: 6553 ...
- HDU3709 Balanced Number —— 数位DP
题目链接:https://vjudge.net/problem/HDU-3709 Balanced Number Time Limit: 10000/5000 MS (Java/Others) ...
- HDU 1257:最少拦截系统
最少拦截系统 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others) Total Sub ...