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 另类方法实现“另存为”功能的更多相关文章

  1. web手工项目02-注册功能输入分析，处理，输出方法-测试用例及缺陷编写-首页轮播图和购物车

    web手工项目第二天笔记 昨日回顾 搭建测试环境(WAMP,phpStudy,tpshop项目文件) 熟悉项目(四个步骤,三个来源) 项目测试流程(需求评审,测试计划与方案,测试用例设计与评审,测试执 ...

  2. 另类方法解决设计Web页面出现:Error Creating Control

    在B/S开发的过程中,经常会遇到这样的提示:Error Creating Control ,而这些页面明明之前是可以打开的,但还是出现如下图所示: 网上找到的方法是把控件初始化放在OnInit里去写, ...

  3. 解密SuperWebview的一种另类方法

    解密SuperWebview的一种另类方法 什么是SuperWebview SuperWebview是APICloud官方推出的另一项重量级API生态产品,以SDK方式提供,致力于提升和改善移动设备W ...

  4. Visual Studio 2010 实用功能:使用web.config发布文件替换功能

    当建立ASP.NET Web应用程序项目后,默认除了生成web.config外,还生成了web.debug.config与Web.Release.config.顾名思义,根据它们的命名我可以推测到他们 ...

  5. (转) Tomcat部署Web应用方法总结

    原文:http://blog.csdn.net/yangxueyong/article/details/6130065 Tomcat部署Web应用方法总结 分类: Java web2011-01-11 ...

  6. 实现Web上的用户登录功能

    关于如何实现web上的自动登录功能 文章来源http://coolshell.cn/articles/5353.html Web上的用户登录功能应该是最基本的功能了,可是在我看过一些站点的用户登录功能 ...

  7. Tomcat部署Web应用方法总结

    转载:http://m.blog.csdn.net/blog/u012516903/15741727 Tomcat部署Web应用方法总结 在Tomcat中部署Java Web应用程序有两种方式:静态部 ...

  8. 你会做Web上的用户登录功能吗？

    Web上的用户登录功能应该是最基本的功能了,可是在我看过一些站点的用户登录功能后,我觉得很有必要写一篇文章教大家怎么来做用户登录功能.下面的文章告诉大家这个功能可能并没有你所想像的那么简单,这是一个关 ...

  9. 解决 SQL 注入的另类方法

    本文是翻译,版权归原作者所有 原文地址(original source):https://bitcoinrevolt.wordpress.com/2016/03/08/solving-the-prob ...

随机推荐

  1. Mac使用小结

    1.修改pip的镜像地址及更新pip https://www.cnblogs.com/techroad4ca/p/5922389.html 2.更新python的库,比如更新six sudo pip ...

  2. poj 1180 Batch Scheduling （斜率优化）

    Batch Scheduling \(solution:\) 这应该是斜率优化中最经典的一道题目,虽然之前已经写过一道 \(catstransport\) 的题解了,但还是来回顾一下吧,这道题其实较那 ...

  3. springboot和redis处理页面缓存

    页面缓存是应对高并发的一个比较常见的方案,当请求页面的时候,会先查询redis缓存中是否存在,若存在则直接从缓存中返回页面,否则会通过代码逻辑去渲染页面,并将渲染后的页面缓存到redis中,然后返回. ...

  4. MVVM模式介绍

    MVVM:模型-视图-视图模型(Model-View-ViewModel)   组成部分Model.View.ViewModel View:UI界面 ViewModel:它是View的抽象,负责Vie ...

  5. POJ - 2142 The Balance（扩展欧几里得求解不定方程）

    d.用2种砝码,质量分别为a和b,称出质量为d的物品.求所用的砝码总数量最小(x+y最小),并且总质量最小(ax+by最小). s.扩展欧几里得求解不定方程. 设ax+by=d. 题意说不定方程一定有 ...

  6. windows server2012之部署HTTPS安全站点

    现在的互联网越来越重视网络安全方面的内容,像我们日常生活中浏览的网上银行网站等涉及安全的你都会发现有https 的标志出现,在URL前加https://前缀表明是用SSL加密的. 你的电脑与服务器之间 ...

  7. SPOJ：K-Query Online（归并树）

    Given a sequence of n numbers a1, a2, ..., an and a number of k-queries. A k-query is a triple (i, j ...

  8. Python实现的一个简单LRU cache

    起因:我的同事需要一个固定大小的cache,如果记录在cache中,直接从cache中读取,否则从数据库中读取.python的dict 是一个非常简单的cache,但是由于数据量很大,内存很可能增长的 ...

  9. HAOI2012高速公路——子区间计算

    题目:https://www.luogu.org/problemnew/show/P2221 似乎按点来算贡献很方便,但我抱住一篇没有这样的题解磕了两天... 以下转载: 题意:维护一段数列 支持区间 ...

  10. Com组件介绍

    COM组件简介 面向对象的思想难以适应这种分布式软件模型,于是组件化程序设计思想得到了迅速的发展. 按照组件化的程序设计的思想,复杂的应用程序被设计成一些小的,功能单一的组件模块,这些组件模块可以运行 ...