摘要：

　　最近有一个非项目的小需求，就是将项目开发分工文件化，方便后期管理维护。但是开发时，分工安排都是以json格式记录的，所以就做了一个将json数据以csv格式下载到本地。

代码：

<!DOCTYPE html>

<html>

    <title>download csv</title>

    <head>

        <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>

        <script type="text/javascript" src="download.js"></script>

    </head>

    <body>

        <div align="center">

            <h3><u>Enter JSON data</u></h3>

            <div class='mydiv'>

                    <textarea id="txt" class='txtarea' rows="15" cols="100">[{"Vehicle":"BMW","Date":"30 Jul 2013 09:24 AM","Location":"Hauz Khas","Speed":42},{"Vehicle":"Honda CBR","Date":"30 Jul 2013 12:00 AM","Location":"Military Road","Speed":0},{"Vehicle":"Supra","Date":"30 Jul 2013 07:53 AM","Location":"Sec-45","Speed":58},{"Vehicle":"Land Cruiser","Date":"30 Jul 2013 09:35 AM","Location":"DLF Phase I","Speed":83}]</textarea>

            </div>

            <br/>

            <button class="download">Download CSV</button>

        </div>

    </body>

</html>

download.js

$(document).ready(function() {

    "use strict";

    var mo = {

        init: function() {

            $('.download').click(function() {

                var data = $('#txt').val();

                if (data === '') {

                    return;

                }

                mo.JSONToCSVConvertor(data, true);

            });

        },

        JSONToCSVConvertor: function(JSONData, ShowLabel) {

            var arrData = typeof JSONData !== 'object' ? JSON.parse(JSONData) : JSONData;

            var CSV = '';

            if (ShowLabel) {

                var row = "";

                for (var index in arrData[0]) {

                    row += index + ',';

                }

                row = row.slice(0, -1);

                CSV += row + '\r\n';

            }

            for (var i = 0; i < arrData.length; i++) {

                var row = "";

                for (var index in arrData[i]) {

                    var arrValue = arrData[i][index] == null ? "" : '="' + arrData[i][index] + '"';

                    row += arrValue + ',';

                }

                row.slice(0, row.length - 1);

                CSV += row + '\r\n';

            }

            if (CSV == '') {

                growl.error("Invalid data");

                return;

            }

            var fileName = "Result";

            if (mo.msieversion()) {

                var IEwindow = window.open();

                IEwindow.document.write('sep=,\r\n' + CSV);

                IEwindow.document.close();

                IEwindow.document.execCommand('SaveAs', true, fileName + ".csv");

                IEwindow.close();

            } else {

                var uri = 'data:application/csv;charset=utf-8,' + escape(CSV);

                var link = document.createElement("a");

                link.href = uri;

                link.style = "visibility:hidden";

                link.download = fileName + ".csv";

                document.body.appendChild(link);

                link.click();

                document.body.removeChild(link);

            }

        },

        msieversion: function() {

            var ua = window.navigator.userAgent;

            var msie = ua.indexOf("MSIE ");

            if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer, return version number

            {

                return true;

            } else { // If another browser,

                return false;

            }

            return false;

        },

        main: function() {

            mo.init();

        }

    };

    mo.main();

});

小结：

　　注意json格式[{},{}]，文件名是在js中定义的变量fileName。主要问题是他会自动添加一行空行，且每个元素都会在值前面加个'='。

下载下来的数据格式为：

js将json数据以csv格式下载的更多相关文章

  1. python实现的json数据以HTTP GET,POST,PUT,DELETE方式页面请求

    一.JSON简介 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.易于人阅读和编写.同时也易于机器解析和生成.它基于JavaScript Programm ...

  2. flink---实时项目----day03---1.练习讲解（全局参数，数据以parquet格式写入hdfs中） 2 异步查询 3 BroadcastState

    1 练习讲解(此处自己没跑通,以后debug) 题目见flink---实时项目---day02 kafka中的数据,见day02的文档 GeoUtils package cn._51doit.flin ...

  3. python实现将json数据以json格式写入txt文件

    json.dumps中indent参数是设置json缩进量的 举例: tmp = { "aaa" : "111", "bbb" : '222 ...

  4. Js -----后台json数据，前端生成下载text文件

    需要引入 <script src="/assets/libs/single_file/jquery.min.js"></script> <script ...

  5. 把HDFS里的json数据转换成csv格式

      1. 全景图 2. 用ListHDFS获取所有文件名   如果想重新再取一次,右健view state:   点击 clear state, 再运行,即可再次采集数据了.   3. 用FetchH ...

  6. C#将数据以XML格式写入Excel

    本文转载:http://www.cnblogs.com/eflylab/archive/2008/09/21/1295580.html c#将数据导入Excel另类方法 今天公司突然给个Excel模版 ...

  7. JS将JSON日期转换为指定格式的日期

    1.引入JS日期转换的函数库 function Format(now,mask) { var d = now; var zeroize = function (value, length) { if ...

  8. node转发请求 .csv格式文件下载 中文乱码问题 + 文件上传笔记

    用户无法直接访问后台接口 需要node端转发请求 并将数据以.csv文件格式生成以供客户端下载. 很不幸出现了中文乱码的问题 挖了各种坟帖,下了各种依赖包,csv.json2csv.bufferHel ...

  9. OAF_文件系列2_实现OAF导出CSV格式文件ExportButton（案例）

    20150727 Created By BaoXinjian

随机推荐

  1. sam9260 adc 测试

    /* * adc_test.c * * Copyright (C) 2007 Mengrz */ #include <stdio.h> #include <stdlib.h> ...

  2. CAS (12) —— CAS TicketRegistry使用JPA方案数据源c3p0与JNDI

    CAS (12) -- CAS TicketRegistry使用JPA方案数据源c3p0与JNDI tomcat版本: tomcat-8.0.29 jdk版本: jdk1.8.0_65 cas版本: ...

  3. WebStorm 7.0 支持更多的Web技术

    JetBrains刚刚发布了WebStorm 7.0 GA,支持EJS.Mustache.Handlebars.Web组件.Stylus.Karma.Istanbul.Compass,并增强了很多功能 ...

  4. C# .net微信开发,开发认证,关注触发消息,自动应答,事件响应,自定义菜单

    成为开发者 string[] ArrTmp = { "token", Request["timestamp"], Request["nonce&quo ...

  5. Shell数组遍历

    #!/bin/bash emp_info=( aaa aaa@qq.com bbb bbb@qq.com ccc ccc@qq.com ddd ddd@qq.com eee eee@qq.com ) ...

  6. 安装redis出现cc adlist.o /bin/sh:1:cc:not found

    安装redis时 提示执行make命令时, 提示 CC adlist.o /bin/sh: cc: 未找到命令 问题原因:这是由于系统没有安装gcc环境,因此在进行编译时才会出现上面提示,当安装好gc ...

  7. 助你简化开发的 jQuery 插件

    Vanity Toolset vanity toolset是一套方便的UI工具集,可以帮助你快速的搭建幻灯,聚光灯,占位,收放相关的UI,它完成了大部分的UI功能,你只需要花费很少时间就可以构建一个完 ...

  8. Qt判断操作系统代码

    Qt4的时候是如下宏定义.Qt5,有所不同.   #include <QtGlobal> ... #ifdef Q_OS_MAC // mac #endif #ifdef Q_OS_LIN ...

  9. 关于GO语言遇到illegal UTF-8 encoding 随手记录

    在使用汉字的时候会报错 解决方案 editpad++ 修改编码为UTF-8 保存就可以了~bingo

  10. hibernate+spring整合增删改事务错误

    org.springframework.dao.InvalidDataAccessApiUsageException: Write operations are not allowed in read ...