zoukankan      html  css  js  c++  java
  • 使用js将页面上的table导出成excel表格

    转自于:https://blog.csdn.net/qq_41594146/article/details/82288841

    function base64(content) {
      return window.btoa(unescape(encodeURIComponent(content)));
    }
    function tableToExcel(tableID, fileName) {
      var excelContent = $("#" + tableID).html();
      // alert(excelContent);
      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 += "<head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets>      </x:ExcelWorkbook></xml><![endif]--></head>";
      excelFile += "<body><table width='10%' border='1'>";
      excelFile += excelContent;
      excelFile += "</table></body>";
      excelFile += "</html>";
      var link = "data:application/vnd.ms-excel;base64," + base64(excelFile);
      var a = document.createElement("a");
      a.download = fileName + ".xlsx";
      a.href = link;
      a.click();
    }

    在js区域中加入上面这段代码.

    设置一个按钮调用上面的tableToExcel方法,第一个参数是你需要转成excel表格的table的id ,第二个参数是excel文件的名字 

    就OK了

    例如:

    <!DOCTYPE html>
    <html>

    <head>
    <meta charset="UTF-8">
    <title></title>
    </head>
    <script src="js/jquery-3.2.1.min.js" type="text/javascript" charset="utf-8"></script>
    <body>
    <table id="tabDiv1">
    <tr>
    <td>ID</td>
    <td>姓名</td>
    <td>年龄</td>
    </tr>
    <tr>
    <td>0001</td>
    <td>张三</td>
    <td>24</td>
    </tr>
    </table>
    <button onclick="tableToExcel();">export to excel...</button>
    <script type="text/javascript">
    function base64(content) {
    return window.btoa(unescape(encodeURIComponent(content)));
    }

    function tableToExcel(tableID, fileName) {
    var excelContent = $("#tabDiv1").html();
    // alert(excelContent);
    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 += "<head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head>";
    excelFile += "<body><table width='10%' border='1'>";
    excelFile += excelContent;
    excelFile += "</table></body>";
    excelFile += "</html>";
    var link = "data:application/vnd.ms-excel;base64," + base64(excelFile);
    var a = document.createElement("a");
    a.download = "fileName" + ".xlsx";
    a.href = link;
    a.click();
    }

    </script>
    </body>

    </html>

  • 相关阅读:
    如何用视频云技术,搞一个爆红的 “反应视频” 项目?
    停车场事故频频,AI 达人将摄像头变身安全卫士
    WebRTC 传输安全机制第二话:深入显出 SRTP 协议
    阿里云视频云 Retina 多媒体 AI 体验馆开张啦!
    20 岁发表 SCI 的学霸,梦想用算法改变世界
    阿里绩效考核,简单到不可思议,员工死心塌地跟你干!(转)
    【官方】阿里巴巴合伙人制度全文(转)
    blob视频地址如何下载(转)
    软件开发项目规划时,SA、SD与SE的区别与重要性 【转】
    一分钟看懂公有云和私有云的区别
  • 原文地址:https://www.cnblogs.com/Ao-min/p/14424360.html
Copyright © 2011-2022 走看看