浏览器端JS导出EXCEL

FileSaver.js 实现了在本身不支持 HTML5 W3C saveAs() FileSaver 接口的浏览器支持文件保存。FileSaver.js 在客户端保存文件的解决方案,并且可以让 Web 应用完美的生成文件, 或者保存不应该发送到外部服务器的一些敏感信息。是一种简单易用实现的利用 JavaScript/JS 在浏览器端保存文件的方案。

实现浏览器端生成并保存文件的 JavaScript 库 FileSaver.js 使用说明:

一、引入 JavaScript 文件:

  1. <script src="path/FileSaver.js"/>

二、例子:

保存成文本文件

  1. var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
  2. saveAs(blob, "hello world.txt");
保存成图片
  1. var canvas = document.getElementById("my-canvas"), ctx = canvas.getContext("2d");// draw to canvas...canvas.toBlob(function(blob) {
  2. saveAs(blob, "pretty image.png");
  3. });
支持的浏览器:

最简单的完整示例:

通过使用FileSave.js实现FileSave.js插件https://github.com/eligrey/FileSaver.js/

注意点:

1.FileSaver.js实现浏览器写入文件到本地磁盘,对于不支持Blob的浏览器需要使用Blob.js。

2.输出内容包含中文的话,内容前面加上?来防止中文乱码。

完整(各种文件格式下载)DEMO源代码下载(包含所有Demo和用到的Js文件):http://download.csdn.net/detail/pplsunny/9673540

html页面代码如下:

    1. <!DOCTYPE html>
    2. <html>
    3. <head>
    4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    5. <title>IE导出CSV</title>
    6. <script src="FileSaver.js"></script>
    7. <script>
    8. window.onload = function(){
    9. function exportCsv2(){
    10. //Excel打开后中文乱码添加如下字符串解决
    11. var exportContent = "\uFEFF";
    12. var blob = new Blob([exportContent+"标题,标题,标题\n1,2,3\n4,5,6"],{type: "text/plain;charset=utf-8"});
    13. saveAs(blob, "hello world.csv");
    14. }
    15. document.getElementById("J_export").onclick = function(){
    16. exportCsv2();
    17. }
    18. }
    19. </script>
    20. </head>
    21. <body>
    22. <a href="javascript:;" id="J_export">导出</a>
    23. </body>
    24. </html>

浏览器端JS导出EXCEL的更多相关文章

  1. 浏览器端JS导出EXCEL——001

    <script src="https://rawgithub.com/eligrey/FileSaver.js/master/FileSaver.js" type=" ...

  2. 利用PHPExcel导出excel 以及利用js导出excel

    导出excel的方法output_excel需要依赖PHPExcel 导出csv的方法csv_export不需要 <?php /** * @author ttt */ class ExcelCo ...

  3. js导出excel

    function inportEx() { $("#btnEx").text("导出中..."); var fugNumber = "";/ ...

  4. js导出Excel表格

    js导出Excel表格 直接上代码: 红色部分:如果表格数据中有“1/1”这样的值,会在导出的Excel中转化为日期“1月1日”,所以才加上了红色那两句.如果返回值中没有这样的格式,红色部分可以不写. ...

  5. JS导出excel设置下载的标题/与angular结合冲突

    2017.8更新 此功能与angular结合使用时,最后一行 document.getElementById("dlink").click(); 与angular的ng-click ...

  6. EasyUI 如何结合JS导出Excel文件

    出处:http://blog.csdn.net/jumtre/article/details/41119991 EasyUI 如何结合JS导出Excel文件 分类: 技术 Javascript jQu ...

  7. [转]tableExport.js 导出excel 如果有负数或是空值 导出前面会自动加上单引号

    原文地址:https://blog.csdn.net/private66/article/details/88718285 tableExport.js  导出excel  如果有负数或是空值 导出前 ...

  8. Html Table用JS导出excel格式问题 导出EXCEL后单元格里的000412341234会变成412341234 7-14 会变成 2018-7-14(7月14) 自定义格式 web利用table表格生成excel格式问题 js导出excel增加表头、mso-number-format定义数据格式 数字输出格式转换 mso-number-format:"\@"

    Html Table用JS导出excel格式问题 我在网上找的JS把HTML Tabel导出成EXCEL.但是如果Table里的数字内容为0开的的导成Excel后会自动删除0,我想以text的格式写入 ...

  9. html js 导出excel表格

    这个使用js 导出excel,可以集成其他语言,可以html,php,asp ,java 等,自己喜欢用那种语言就用哪种,使用非常方便.js是使用tableExport.js ,jquery-3.2. ...

随机推荐

  1. electron 缓存目录 禁用缓存

    C:\Users\Administrator\AppData\Roaming\linksame // 禁用缓存 app.commandLine.appendSwitch("--disable ...

  2. 负载均衡之F5设备

    http://xjsunjie.blog.51cto.com/999372/666672 目前全球范围内应用比较广泛的负载均衡设备为美国的F5.F5于2000年底进驻中国,在国内业界,F5负载均衡产品 ...

  3. c#打包文件解压缩 C#中使用委托、接口、匿名方法、泛型委托实现加减乘除算法 一个简单例子理解C#的协变和逆变 对于过长字符串的大小比对

    首先要引用一下类库:using Ionic.Zip;这个类库可以到网上下载. 下面对类库使用的封装方法: 得到指定的输入流的ZIP压缩流对象 /// <summary> /// 得到指定的 ...

  4. 使用".."指定git提交范围与"..."指定git提交范围的区别

    http://blog.csdn.net/hansel/article/details/8952967 使用".."(两个点)和"..."(三个点)都可以指定一 ...

  5. kubernetes之创建基于名称空间的内存和cpu限额示例

    系列目录 首先我们创建一个名称空间 kubectl create namespace quota-mem-cpu-example 创建资源配额 apiVersion: v1 kind: Resourc ...

  6. 在Livemedia的基础上开发自己的流媒体客户端 V 0.01

    在Livemedia的基础上开发自己的流媒体客户端 V 0.01 桂堂东 xiaoguizi@gmail.com 2004-10 2004-12 友情申明: 本文档适合已经从事流媒体传输工作或者对网络 ...

  7. 《学习opencv》笔记——矩阵和图像操作——cvConvertScale,cvConvertScaleAbs,cvCopy and cvCountNonZero

    矩阵和图像的操作 (1)cvConvertScale函数 其结构: void cvConvertScale( //进行线性变换,将src乘scale加上shift保存到dst const CvArr* ...

  8. 【BZOJ1483】[HNOI2009]梦幻布丁 链表+启发式合并

    [BZOJ1483][HNOI2009]梦幻布丁 Description N个布丁摆成一行,进行M次操作.每次将某个颜色的布丁全部变成另一种颜色的,然后再询问当前一共有多少段颜色.例如颜色分别为1,2 ...

  9. EasyPusher直播推送中用到的缓冲区设计和丢帧原理

    问题描述 我们在开发直播过程中,会需要用到直播推送端,推送端将直播的音视频数据推送到流媒体服务器或者cdn,再由流媒体服务器/CDN进行视频的转发和分发,提供给客户端进行观看.由于直播推送端会存在于各 ...

  10. Red Black Tree java.util.TreeSet

    https://docs.oracle.com/javase/9/docs/api/java/util/SortedMap.html public interface SortedMap<K,V ...