• HTML的table表格导出为excel的两种方式


    1. 使用 a 标签 download 属性,将文件名和后缀名拼接下载。

      注意:如果是后台生成的纯前端表格可以使用此方法,此方法可以将 table 内的 css 样式进行保留,不能导出 td 标签中 input 输入框的值。但是可以在导出前将 input 的值取出并替换在 td 里面的值即可导出。

      <script type="text/javascript" charset="utf-8">
          function base64(content) {
          	return window.btoa(unescape(encodeURIComponent(content)));
          }
          function tableToExcel(tableID) {
          	var excelContent = $("#" + tableID).html();
          	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");
              var fileName = $("#filename").val();
              a.download = fileName + ".xlsx";
              a.href = link;
              a.click();
      	}
      </script>
      
    2. 使用 jquery 的 table2excel 插件导出 excel。

      注意:此方法可以导出 td 标签中 input 输入框的值,但是不能将 table 内的 css 样式进行保留。可以更改此插件源码进行 css 样式编写。

      function table2excel(){
      	$("#table2excel").table2excel({
      		// 不被导出的表格行的class类
      		exclude: ".noExl",
      		// 导出的Excel文档的名称
      		name: "表格-" + new Date().getTime(),
      		// Excel文件的名称
      		filename: $("#filename").val(),
      		//文件后缀名
      		fileext: ".xls",
      		//是否导出图片
      		exclude_img: false,
      		//是否导出超链接
      		exclude_links: false,
      		//是否导出输入框中的内容
      		exclude_inputs: false
      	});
      }
      

    这是我目前知道的 HTML 表格导出 excel 两种方式,请各位根据自己的需求进行选择。

  • 相关阅读:
    delphi string.split 按照任意字符串分割语句
    学习 TTreeView [16]
    学习 TTreeView [15]
    delphi TClientDatset资料
    delphi7 clientdataset 详解
    为TMenuItem增加指针Data属性
    构建一个用于产品介绍的WEB应用
    图片延迟加载技术-Lazyload的应用
    你想不到的压缩方法:将javascript文件压缩成PNG图像存储
    如何更快速加载你的JS页面
  • 原文地址:https://www.cnblogs.com/thetree/p/13596676.html
Copyright © 2020-2023  润新知