码迷,mamicode.com
首页 > Web开发 > 详细

js json转csv

时间:2020-03-28 10:43:58      阅读:85      评论:0      收藏:0      [点我收藏+]

标签:element   set   write   useragent   toc   create   rda   方法   data   

$(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();

});

另一种

下载的的方法是构建Url

data:text/csv;charset=UTF-8,Base32编码的csv字符串。

 

限制:

谷歌浏览器和IE浏览器对Url的最大长度限制不一样,总的来说,在前端组建CSV适用性非常有限,而且存在兼容性问题,不推荐使用。

function JSONToCSVConvertor(JSONData, ReportTitle, ShowLabel) {
    var arrData = typeof JSONData != ‘object‘ ? JSON.parse(JSONData) : JSONData;
    var CSV = "\ufeff";
    var firfixCSV = "\ufeff";
    if (ShowLabel) {
        var row = "";
        var firfixRow = "";
        for (var index in arrData[0]) {
            row += index + ‘,‘;
            firfixCSV += index + ‘,‘;
        }
        CSV += row.slice(0, -1) + ‘\r\n‘;
        firfixCSV = (firfixCSV.slice(0, -1) + ‘\n‘);
    }
    for (var i = 0; i < arrData.length; i++) {
        var row = "";
        for (var index in arrData[i]) {
            row += ‘"‘ + arrData[i][index] + ‘",‘;
            firfixCSV += arrData[i][index] + ‘,‘;
        }
        row.slice(0, row.length - 1);
        CSV += row + ‘\r\n‘;
        firfixCSV = (firfixCSV.slice(0, -1) + ‘\n‘);
    }

    if (CSV == ‘‘) {
        alert("Invalid data");
        return;
    }
    var link = document.createElement("a");
    link.id = "lnkDwnldLnk";
    document.body.appendChild(link);
    var csv = CSV;
    blob = new Blob([csv], { type: ‘text/csv,charset=UTF-8‘, endings: ‘native‘ });
    if (window.webkitURL) {
        var csvUrl = window.webkitURL.createObjectURL(blob);
    } else {
        var csvUrl = ‘data:text/csv;charset=UTF-8,\ufeff‘ + encodeURIComponent(firfixCSV);
    }
    var filename = ReportTitle + ‘.csv‘;
    $("#lnkDwnldLnk")
    .attr({
        ‘download‘: filename,
        ‘href‘: csvUrl
    });
    $(‘#lnkDwnldLnk‘)[0].click();
    $(‘.bs-example-modal-lg‘).modal(‘hide‘);
    document.body.removeChild(link);
}

 

js json转csv

标签:element   set   write   useragent   toc   create   rda   方法   data   

原文地址:https://www.cnblogs.com/suntp/p/9073162.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!