如何使用html表格自定义或采用tableexport.js第三方插件以excel格式导出

最新推荐文章于 2021-06-25 01:16:03 发布
最新推荐文章于 2021-06-25 01:16:03 发布
阅读量258 收藏
点赞数
文章标签： javascript python java ViewUI
原文链接：https://my.oschina.net/u/3378039/blog/1560445
版权

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

First method :user-defined

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- 命名x空间即调用excel里的属性-->
<html xmlns:x="urn:schemas-microsoft-com:office:excel">
<head>
   <!-- 显示网格线 -->
   <xml>
      <x:ExcelWorkbook>
         <x:ExcelWorksheets>
            <x:ExcelWorksheet>
               <x:Name></x:Name>
               <x:WorksheetOptions>
                  <x:Print>
                     <x:ValidPrinterInfo />
                  </x:Print>
               </x:WorksheetOptions>
            </x:ExcelWorksheet>
         </x:ExcelWorksheets>
      </x:ExcelWorkbook>
   </xml>
   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>导出excel文档</title>
</head>
<body>
<%
   String exportToExcel = request.getParameter("exportToExcel");
   String fileName = request.getParameter("fileName")==""?"excel":request.getParameter("fileName");
   if (exportToExcel != null
         && exportToExcel.toString().equalsIgnoreCase("YES")) {
      //设置内容和头文件为excel形式
      response.setContentType("application/vnd.ms-excel");
      response.setHeader("Content-Disposition","inline; filename="+fileName+".xls");
   }
%>
<table align="left" border="2">
   <thead>
   <tr>
      <th>Sr. No.</th>
      <th>Text Data</th>
      <th>Number Data</th>
   </tr>
   </thead>
   <tbody>
   <%for (int i = 0; i < 10; i++) {%>
   <tr>
      <td align="center"><%=i + 1%></td>
      <td align="center">This is text data <%=i%></td>
      <td align="center"><%=i * i%></td>
   </tr>
   <%}%>
   </tbody>
</table>
<%
   for (int i = 0; i < 10; i++) {
%>
 <br>
<%}if (exportToExcel == null) {%>
<p>
   <form action="" method="post">
   <input type="hidden" name="exportToExcel" value="YES">
   <!-- 自定义文件名，没有则默认excel.xls -->
请输入你要保存为EXCEL文档的文件名<input type="text" name="fileName" placeholder="如:excel">
 <input type="submit" value="Export to Excel">
</form>
</p>
<%}%>
</div>
</body>
</html>

Second method :Using tableexport.js  plug-in

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
   <meta charset="UTF-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>导出为Excel格式文件</title>
   <link href="../static/bootstrap/css/bootstrap.min.css" rel="stylesheet">
   <link href="../static/bootstrap/css/bootstrap-theme.min.css" rel="stylesheet">
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
   <link href="../static/dist/css/tableexport.min.css" rel="stylesheet">
   <!--[if IE]>
   <script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>
   <![endif]-->
</head>
<body>
<div class="container">
   <div class="row">
      <div class="col-md-12">
         <br>
         <h4>Countries By Population</h4>
         <div class="table-responsive">
            <table id="Population-list-1" class="table table-striped table-bordered"
                  data-name="cool-table">
               <thead>
               <tr>
                  <th>Sr. No.</th>
                  <th>Text Data</th>
                  <th>Number Data</th>
               </tr>
               </thead>
               <tbody>
                  <%for (int i = 0; i < 10; i++) {%>
               <tr>
                  <td align="center"><%=i + 1%></td>
                  <td align="center">This is text data <%=i%></td>
                  <td align="center"><%=i * i%></td>
               </tr>
                  <%}%>
               <tbody>
            </table>
         </div>
      </div>
   </div>
</div>
<!--  获取文件名  -->
<input type="hidden" name="FileName" value="FileName" id="FileName">
<script src="http://libs.useso.com/js/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>
<!-- 显示按钮插件 -->
<script>window.jQuery || document.write('<script src="../static/js/jquery-1.11.0.min.js"><\/script>')</script>
<script src="../static/bootstrap/js/bootstrap.min.js"></script>
<script src="../static/js/xlsx.core.min.js"></script>
<script src="../static/js/blob.js"></script>
<script src="../static/js/FileSaver.min.js"></script>
<script src="../static/dist/js/tableexport.js"></script>
<script type="text/javascript">
   $(function(){
      var FileName = window.document.getElementById('FileName').value;
      $("table").tableExport({
         headings: true,
         footers: true,
         formats:["xlsx","xls","csv","txt"],
         fileName:FileName,
         bootstrap:true
      });
   })
</script>
</body>
</html>

下载相关插件可参照该博主:http://www.jqueryfuns.com/resource/2381

注：当然方法多种多样，你也可以自己在方法一的基础之上调CSS样式等，若有不足之处，欢迎指点。

转载于:https://my.oschina.net/u/3378039/blog/1560445

weixin_33895516
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
只涉及前端，将html页面导出成excel文档
biliPS的博客
07-26 3535
用exceljs插件，前端实现html导出excel文档
Html Table数据导出工具tableExport.js(包含PDF中文问题解决)
godlewis
11-07 1616
采用插件，功能强大。 https://github.com/hhurz/tableExport.jquery.plugin 同时还有个简版，不要混淆了（这两个版本对中文处理不好，建议用上面那款） https://github.com/kayalshri/tableExport.jquery.plugin https://github.com/golfing4ca/tableExport...
java html导出excel插件_如何使用html表格自定义或采用tableexport.js第三方插件以excel格式导出...
weixin_35462155的博客
02-28 106
First method :user-defined导出excel文档String exportToExcel = request.getParameter("exportToExcel");String fileName = request.getParameter("fileName")==""?"excel":request.getParameter("fileName");if (expo...
excel的xml表示形式
huwei0518的专栏
02-06 3162
公司一个变态要求把表格导出为excel，另一个变态用的是个鸟（此鸟专指我一同学）都没听说过的tcl。而tcl对这个的支持就根本没有，网上资料也找不到，尼玛的。     经过几天的折磨，最后发现，导出excel文件的需求很常见，java有poi，c#是微软开发的，调同样微软开发的excel更是简单的一塔，别的语言也都有很多人已经开发出组件或者有很多解决方案了，但是tcl这种狗屁语言，网上资料根本就
xssfsheet导出有html,React+后端实现导出Excle表格的功能
weixin_39744230的博客
06-25 200
最近在做一个基于React+antd前端框架的Excel导出功能，我主要在后端做了处理。在做这类导出文件的功能，其实，在后端进行处理，会更容易些，虽然前端也可以进行处理，但还是建议后端来做，因为很多导出工具类基本都是很好用。根据以下步骤，可以很容易就实现导出Excel表格数据的功能。1.导出图标按钮代码：1 导出2.按钮this.excelToPort的方法：1 excelToPort = () ...
jquery插件将html表格导出为excel格式文件tableexport.js插件
03-07
jquery插件将html表格导出为excel格式文件，点击按钮一键导出，只需要引入js，写几行代码块就可完成导出功能，写可修改，有案例。 tableexport.js插件
jQuery插件将HTML表格导出为Excel格式文件 - tableexport.js插件
06-29
jQuery插件将HTML表格导出为Excel格式文件 - tableexport.js插件，jQuery插件将HTML表格导出为Excel格式文件 - tableexport.js插件（html）
tableExport.js实现前端表格的导出功能(支持中文)及打印
11-17
该插件可以将Html的表格导出成为 JSON, XML, CSV, TSV, TXT, SQL, Word, Excel, PNG，PDF格式。在项目上遇到pdf导出中文乱码问题，经过一天的研究修改了一些js代码解决了pdf导出中文乱码问题，随便融入了一个html...
tableExport.jquery.plugin：jQuery插件，用于将html表导出为JSON，XML，CSV，TSV，TXT，SQL，Word，Excel，PNG和PDF
02-04
tableExport.jquery.plugin 将HTML表格导出到 CSV DOC JSON格式 PDF格式 PNG SQL 硅通Kong 文本 XLS（Excel 2000 HTML格式） XLSX（Excel 2007 Office Open XML格式） XML（Excel 2003 XML电子表格格式） XML...
tableExport.jquery.plugin:jQuery插件可将html表导出为JSON，XML，CSV，TSV，TXT，SQL，Word，Excel，PNG和PDF
05-10
tableExport.jquery.plugin 将HTML表格导出到 CSV DOC文件 JSON格式 ... 要以XLSX（Excel 2007+ XML格式）格式导出表，您需要另外包括： < script type =" text/javascript " src =" libs/js-xls
HTML表格导入Excel插件
10-17
将网页上的表格导入Excel，使用方法如下： $("#tableExcel").table2excel({ exclude: ".noExl", filename:projectname, name:"Excel Document Name", exclude_img:true, exclude_links:true, exclude_inputs:true });
前端-HTML-Web Excel导入
04-26
前端_HTML_Web Excel导入，内有可以使用的demo，前端_HTML_Web Excel导入，内有可以使用的demo
js导出excel插件
07-26
js导出excel插件，需要配置为网站
js导出table 可自定义导出文件名，可导出css样式
09-14
js导出table 可自定义导出文件名，可导出css样式，也是我在项目中用到的，希望可以帮助到大家，里面有注释讲解
js 实现纯前端将数据导出excel两种方式，亲测有效
GoodIdea
11-27 1809
由于项目需要，需要在不调用后台接口的情况下，将json数据导出到excel表格，参考了好多资料以及很多大佬写的博客终于实现，兼容chrome没问题，其他还没有测试过，这边介绍两种实现方式，并附上代码和gif动图，博主不才还望轻喷 方法一 将table标签，包括tr、td等对json数据进行拼接，将table输出到表格上实现，这种方法的弊端在于输出的是伪excel，虽说生成xls为后缀的文件，但文件...
html可编辑的excel表格控件,Handsontable 现在版的 Excel 表格编辑器插件 - 文章教程...
weixin_39763033的博客
06-05 681
HandsonTable 简介Handsontable 是一个类似 Excel 表格编辑器，支持丰富的展现和交互，以及多样的单元格展现和配置核心由原生 js (es6) 编写，通过 webpack 打包同类 Jspreadsheets 项目中，点赞最多，Jspreadsheets列表HandsonTable 支持的特征Handsontable 的一些主要功能：editContext menuDra...
excel转换成html插件,jQuery插件将HTML表格导出为Excel格式文件 - tableexport.js插件
weixin_39610631的博客
05-30 240
TableExport是一款可以将HTML表格导出为Excel xlsx格式、xls格式，以及csv和txt文件的jQuery插件。TableExport插件使用简单，默认使用Bootstrap的CSS表格样式，也支持普通的HTML表格。安装可以通过bower或npm来安装TableExport插件。$ bower install tableexport.js$ npm install table...
html excel插件,Web端如此强大的电子表格Excel插件，轻松进行数据处理——jExcel
weixin_42239175的博客
06-14 3785
介绍jExcel是一个轻量级的原生javascript插件，用于创建与Excel或任何其他电子表格软件兼容的基于Web的交互式表格和电子表格。可以从JS数组，JSON，CSV或XSLX文件创建在线电子表格表。可以从excel复制并直接粘贴到jExcel电子表格，反之亦然。集成任何第三方javascript插件非常容易，可以创建自己的自定义列，自定义编辑器，并在应用程序中自定义任何功能。jExcel...
html导出excel
weixin_30607029的博客
09-30 698
function base64 (content) { return window.btoa(unescape(encodeURIComponent(content))) } function exportTab () { // 导出 let tath = this let table = document.getElementById('tableID') //t...
html表格excel导出前端插件
最新发布
12-01
TableExport.js是一个轻量级的jQuery插件，可以将HTML表格导出为Excel、CSV、TXT和PDF格式。使用该插件需要引入jQuery库和TableExport.js文件。 ```html <!-- 引入jQuery库 --> <script src="https://cdn.bootcss....

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值