zoukankan      html  css  js  c++  java
  • 前端导出excel表格方法

    在日常业务中,有一些没有规律的表格需要导出是,在后端处理会非常麻烦,我们可以把数据提取到html table标签中,然后进行导出

    代码如下:

    //前端导出excel表格
    function ExcelConvertor(data, FileName) {
        if (FileName == null) {
            FileName = "下载文件";
        }
        var excelFile = "<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:x='urn:schemas-microsoft-com:office:excel' xmlns='http://www.w3.org/TR/REC-html40'>";
        excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">';
        excelFile += '<meta http-equiv="content-type" content="application/vnd.ms-excel';
        excelFile += '; charset=UTF-8">';
        excelFile += "<head>";
        excelFile += "<!--[if gte mso 9]>";
        excelFile += "<xml>";
        excelFile += "<x:ExcelWorkbook>";
        excelFile += "<x:ExcelWorksheets>";
        excelFile += "<x:ExcelWorksheet>";
        excelFile += "<x:Name>";
        excelFile += "worksheet1";
        excelFile += "</x:Name>";
        excelFile += "<x:WorksheetOptions>";
        excelFile += "<x:DisplayGridlines/>";
        excelFile += "</x:WorksheetOptions>";
        excelFile += "</x:ExcelWorksheet>";
        excelFile += "</x:ExcelWorksheets>";
        excelFile += "</x:ExcelWorkbook>";
        excelFile += "</xml>";
        excelFile += "<![endif]-->";
        excelFile += "</head>";
        excelFile += "<body>";
        excelFile += data;
        excelFile += "</body>";
        excelFile += "</html>";
    
        var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent(excelFile);
    
        var link = document.createElement("a");
        link.href = uri;
    
        link.style = "visibility:hidden";
        link.download = FileName + ".xls";
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
    }

    使用场景:

    <div id="show-selected" style="display: none;">
                    <h3 style="float:right;">单位:元</h3>
                    <cs-table :tablekey="tablekey" :tabledata="tabledata"></cs-table>
     </div>
    
    function Export() {
                var data = $("#show-selected").html();
                ExcelConvertor(data, "文件名");
            }
  • 相关阅读:
    windows小乌龟和git使用
    badboy录制过程中出现当前页面的脚本发现错误
    jmeter返回结果出现乱码
    jmeter入门操作 = 录制
    jmeter入门操作 = 接口
    jmeter工具下载及工具功能操作介绍
    程序的机器级表示(一)
    信息的表示和处理之浮点数
    信息的表示和处理之整数运算
    信息的表示和处理之整数表示
  • 原文地址:https://www.cnblogs.com/haixiaocan/p/11943545.html
Copyright © 2011-2022 走看看