js把数据导出成excel的中文乱码问题解决

最新推荐文章于 2024-06-18 10:49:09 发布
最新推荐文章于 2024-06-18 10:49:09 发布
阅读量7.8k 收藏 2
点赞数 1
分类专栏： JavaScript 文章标签： 乱码 excel 数据导出
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/hry1243916844/article/details/75939432
版权

由于项目中有这个需求，网上的方法各种各样，但都没解决问题，几经调试终于成功，分享下源码仅供参考：
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 uri = 'data:text/csv;charset=utf-8,\uFEFF' + encodeURI(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();
});

test.html

<!DOCTYPE html>
<html>
    <title>download csv</title>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <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>输入JSON数据</u></h3>
            <div class='mydiv'>
                    <textarea id="txt" class='txtarea' rows="15" cols="100">
                    [
                        {"Vehicle":"第一个","Date":"6月30日","Location":"山东"},
                        {"Vehicle":"第二个","Date":"6月30日","Location":"上海"},
                        {"Vehicle":"第三个","Date":"6月30日","Location":"北京"},
                        {"Vehicle":"第四个","Date":"6月30日","Location":"深圳"}
                    ]
                    </textarea>
            </div>
            <br/>
            <button class="download">下载CSV</button>
        </div>
    </body>
</html>
我是小怪兽-
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
专栏目录
javascript读取excel数据
08-03
demo： <html> <head> <meta charset="UTF-8"> <title></title> [removed][removed] </head> <body> <input type="file" /> [removed] /* FileReader共有4种读取方法： 1.readAsArrayBuffer(file)：将文件读取为ArrayBuffer。 2.readAsBinaryString(file)：将文件读取为二进制字符串 3.readAsDataURL(file)：将文件读取为Data URL 4.readAsText(file, [encoding])：将文件读取为文本，encoding缺省值为'UTF-8' */ var wb;//读取完成的数据 var rABS = false; //是否将文件读取为二进制字符串 function importf(obj) {//导入 if(!obj.files) { return; } var f = obj.files[0]; var reader = new FileReader(); reader.onload = function(e) { var data = e.target.result; if(rABS) { wb = XLSX.read(btoa(fixdata(data)), {//手动转化 type: 'base64' }); } else { wb = XLSX.read(data, { type: 'binary' }); } //wb.SheetNames[0]是获取Sheets中第一个Sheet的名字 //wb.Sheets[Sheet名]获取第一个Sheet的数据 document.getElementById("demo")[removed]= JSON.stringify( XLSX.utils.sheet_to_json(wb.Sheets[wb.SheetNames[0]]) ); }; if(rABS) { reader.readAsArrayBuffer(f); } else { reader.readAsBinaryString(f); } } function fixdata(data) { //文件流转BinaryString var o = "", l = 0, w = 10240; for(; l < data.byteLength / w; ++l) o += String.fromCharCode.apply(null, new Uint8Array(data.slice(l *
javascript导出excel中文乱码
flyhorse1010的专栏
02-20 778
excel中文乱码；BOM字符
js导出csv文件，符号乱码问题
最新发布
C_xran的博客
06-18 302
核心为：'\ufeff'，在准备的blob流数据前添加\ufeff，这样就解决在Microsoft excel符号乱码问题。
前端js导出excel代码及出现的中文乱码和数字过长等问题的解决办法
热门推荐
q727810272的博客
08-01 1万+
本来之前写过一个JS导出程序，但是也是网上东拼西凑写出来了，这两天有需求要写个excel导出，然后就出现一堆的问题，就准备记录下来。 原谅我好多东西也是网上百度别人的，但是都汇总了一下，也好给大家看，开始正文：  js导出excel的两种方法： 目录  js导出excel的两种方法： 方法一： 方法二： 以上两种方法在IE浏览器中无法正常使用 若需要支持ie需加以下代码： 再把遇...
js 导出Excel文件乱码问题
早晚的博客
03-16 2933
$.ajax({ type: 'post', url: "", xhrFields: { responseType: "blob" }, // 主要是这一句 data: {}, success: function(data) { that.download(data,'自己起的名字.xlsx') } }) }, download(data, fileName) { if (!data) { return } let url = window.U.
js导出的excel文件无法打开/打开乱码，excel无法打开xxx.xlsx因为文件格式或文件扩展无效
红烧咸咸鱼
03-11 1270
js导出的excel文件无法打开/打开乱码，excel无法打开xxx.xlsx因为文件格式或文件扩展无效
tableExport.js excel乱码解决方法
08-25
自从上次用bootstrap table就一直没有解决导出excel的关题,网上找到的那更改tableExport.js和jquery.base64.js的方法虽然可以正常导出,但中文依旧乱码... 解决方法终归是有的....现将文件分享给大家. 里面有table...
js导出execl(支持IE,FF,chrome)解决中文乱码
06-09
js导出execl(支持IE,FF,chrome)，并解决FF,chrome下的中文乱码
tableExport + base64 excel、png导出无中文乱码
12-02
在导出Excel或PNG时，数据会被转换成Base64字符串，这样可以在前端直接显示或者通过Ajax发送到服务器，无需额外的文件上传操作。 然而，当处理包含中文字符的数据时，可能会遇到乱码的问题。这是因为中文字符在不同...
vue中后端做Excel导出功能返回数据流前端的处理操作
01-21
因为需求对导出表格的数据格式和样式有要求，所以这个导出功能放到后端来做，而且后端返回的是数据流，所以需要处理成想要的表格并导出来。 先看下效果图： 页面效果： 点击 导出Excel 调用导出接口成功了： 后台...
解决tableExport导出到excel中文乱码
08-03
解决tableExport导出到excel中文乱码，解决tableExport导出到excel中文乱码，解决tableExport导出到excel中文乱码，解决tableExport导出到excel中文乱码
解决tableexport导出到excel中有关中文乱码的问题
weixin_34404393的博客
09-02 674
2019独角兽企业重金招聘Python工程师标准>>> ...
json文件导出excel文件，及乱码问题
huazi99的博客
03-14 466
json文件导出excel文件，及乱码问题
【JS】前端处理后端返回的流（转为word文档或excel）
weixin_46682277的博客
08-06 4192
前提：后端返回的流是word格式的，是一堆乱码，前端需要对流处理并导出为word格式实现：主要是借助于和标签的和属性具体代码实现如下：按项目需求：要导出某个用户的空白试卷和已答试卷 封装好的方法：...
调用后台接口实现Excel导出功能以及导出乱码问题解决
分享互联网的有趣知识~
11-17 3636
处理blob文件格式，后端返回的数据可能是乱码的，所以需要先处理乱码的数据，否则导出来的文件是无法使用的的。
前端d3.js读取excel或csv并导出，以及如何解决读取中文乱码问题,详见注释
weixin_42129248的博客
03-16 1366
前端d3.js读取excel或csv并导出，以及如何解决读取中文乱码问题,详见注释
Django导出excel中文乱码解决方案
qq_38472574的博客
09-05 214
Django导出excel中文乱码解决方案
php 导出表格中文乱码,如何解决php excel reader导出excel中文乱码？
06-07
如果在使用 PHP Excel Reader 导出 Excel 文件时出现中文乱码的问题，可能是因为 Excel 文件的编码格式与 PHP 文件的编码格式不一致导致的。你可以尝试以下两种方法解决该问题： 1. 将 Excel 文件另存为 UTF-8 编码格式。 在 Excel 中打开需要导出的文件后，点击“文件” -> “另存为”，在“编码”选项中选择“UTF-8”编码，保存文件后再进行导出。 2. 在 PHP 中设置编码格式。 在 PHP 文件中，使用以下代码设置编码格式： ```php header("Content-Type:text/html;charset=utf-8"); ``` 或 ```php ini_set('default_charset','utf-8'); ``` 这样就可以保证 PHP 和 Excel 文件的编码格式一致，解决中文乱码问题。
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值