messud4312
messud4312

html页面里table导出为excel

只要想不到，没有做不到，一直都不知道html里table元素可直接导出为excel，太牛逼了！

这其中用到一个jquery的插件table2excel 

使用方法也很简单：

1 。 包含必要的文件

<script src="src/1.11.1/jquery.min.js"></script>
<script src="src/jquery.table2excel.js"></script>

2。 创建导出按钮

<button>Export</button>

3。 给导出按钮添加事件

$(".table2excel").table2excel({
  exclude: ".noExl",  // 不想导出的行加上class='noExl'即可
  name: "Excel Document Name", // excel文档名
  filename: "myFileName" // excel文件名
});

完整的看下DEMO

<!DOCTYPE html>
<html>
  <head>
    <title>jQuery Boilerplate</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script src="../src/jquery.table2excel.js"></script>
  </head>
  <body>
    <table class="table2excel" data-tableName="Test Table 1">
      <thead>
        <tr class="noExl"><td>This shouldn't get exported</td><td>This shouldn't get exported either</td></tr>
        <tr><td>This Should get exported as a header</td><td>This should too</td></tr>
      </thead>
      <tbody>
        <tr><td>data1a</td><td>data1b</td></tr>
        <tr><td>data2a</td><td>data2b</td></tr>
      </tbody>
      <tfoot>
        <tr><td colspan="2">This footer spans 2 cells</td></tr>
      </tfoot>
    </table>

    <table class="table2excel" data-tableName="Test Table 2">
      <thead>
        <tr class="noExl"><td>This shouldn't get exported</td><td>This shouldn't get exported either</td></tr>
        <tr><td>This Should get exported as a header</td><td>This should too</td></tr>
      </thead>
      <tbody>
        <tr><td>data1a</td><td>data1b</td></tr>
        <tr><td>data2a</td><td>data2b</td></tr>
      </tbody>
      <tfoot>
        <tr><td colspan="2">This footer spans 2 cells</td></tr>
      </tfoot>
    </table>

    <script>
      $(function() {
        $(".table2excel").table2excel({
          exclude: ".noExl",
          name: "Excel Document Name",
          filename: "myFileName"
        });
      });
    </script>
  </body>
</html>


你可能感兴趣的:(table2excel)

  • table2excel 不能导出 input 输入框 oNexiaoyao
    使用方式具体导出代码$('#tableShow').table2excel({exclude:".noExl",name:"ExcelDocumentName",filename:"name-"+moment($('#dateTime').data('DateTimePicker').date()).format('YYYY-MM-DD'),fileext:".xls",exclude_img:t
  • vue js-table2excel 导出excel 可带多张图片 不掰手腕 javascriptvue.jsexcel
    1.安装js-table2excel插件：npminstalljs-table2excel2.使用2.1:引入importtable2excelfrom'js-table2excel';2.2:导出函数functionexportExcel(){console.log('导出',table2excel);constcolumn=[{title:'二维码id',key:'fname',type:'t
  • 页面的table直接转excel并下载（不需要经过后台） 往事不堪回首.. excel
    1.demo.htmlTABLE转换EXCEL.btn{margin:20px;}标题一标题二标题三100(不导出)200(不导出)300(不导出)400500600$(function(){$(".btn").click(function(){$(".table2excel").table2excel({//不被导出的表格行的CSSclass类exclude:".noExl",//导出的Exce
  • Vue之table2excel应用--前端表格导出 月下脆竹書閣 VUE前端vue.js
    前端将后台传过来的数据，自定义去导出，不仅减少了再次去loading后台接口的时间，而且提高的用户体验度。但弊端是只能是当前表格所获取到的所有信息。所以用于不用取决于自己侧重哪一方面。table2excel的使用方法1.下载jquery.table2excel.js和jquery.table2excel.min.js2.添加到Vue项目中【public->新建文件夹table2excel->添加到
  • 导出前端table为excel文件最简单方法 weixin_45411740 javascriptcssjquery前端
    导出前端table为excel文件最简单方法1.导入js文件这里jquery.table2excel.js使用的是https的链接，所以直接复制即可使用，jquery文件可自行下载2.编写table，编写导出按钮名字年龄性别身高xxx23男173xxx30女150导出3.编写方法functionetest(){$("#excTable").table2excel({exclude:".id",na
  • 前端页面HTML表格生成EXCEL下载 huahua.Dr 前端技术
    前言主要使用jquery插件工具table2excel来实现将HTML页面上的table表格生成Excel下载到客户端。（兼容IE和chrome浏览器）由于功能比较简单，会使用jquery的相关工具就可以了；实现这个功能的方法还有很多，例如还可以使用jquery工具库的dataTable或者tableExport插件等等；本次只要说一下table2excel插件简单实现这个功能。本次使用一种比较简
  • 使用jquery.table2excel.js导出表格，可指定不导出的列 HI阡陌 web前端
    1：引入相关js文件2：页面布局带noExlclass的行不会被输出到excel中带noExlclass的行不会被输出到excel中这一行会被导出到excel中这一行会被导出到excel中合并2个单元格单元格1-1单元格1-2单元格2-1单元格2-2单元格3-1单元格3-2注意：table标签上必须加入table2excel类名；如果表格中的某一行不需要导出到Excel中，可以为这一行添加.noE
  • vue+table2excel 导出JSON数据到excle 一捆铁树枝 table2excelVue
    最近在做一个信息采集管理系统，需要把采集到的信息导出到excle，先说说在vue中安装和引入table2excel//安装npminstalljs-table2excel//引入importtable2excelfrom'js-table2excel'采集系统需要收集的信息包含姓名、手机号、身份证号、还有一项是上传图片；模拟数据如下：constdata=[{name:"张三",phone:"135
  • table2excel实现html页面table导出Excel Hank_谢旱
    一背景这两天客户要求在一个页面做一个导出功能，这个页面比较复杂，数据都是通过js联动计算得出，也就是说页面展示的数据和数据库保存的是不一致的，是因为首先从数据库查询出来，再通过js将相关联字段计算得出要的值，因为这个所以给导出造成麻烦。二思考1.如果通过poi来导出，是可行的，但是相当于将js的算法用java再来一遍，理论可行，但是耗时；2.有没有其他方式直接将html页面数据抓取出来，省略计算过
  • 定制table2excel插件，支持自定义列，导出excel 包子源 jQuery
    首先需要下载定制版的table2excel。没有积分的童鞋请访问链接:https://pan.baidu.com/s/1dE5P8YH密码:g83j需要积分下载地址定制版table2excel然后引入jquery和table2excel具体代码如下：//点击id为excelbtn的按钮$("#excelbtn").click(function(){//.tableexcel是需要导出table的c
  • Jquery中使用table2excel插件实现将Html的table导出为Excel(附示例代码和资源下载) 霸道流氓
    场景jquery-table2excel是一款可以将HTML表格的内容导出到微软Excel电子表格中的jQuery插件。效果在Html中有一个表格点击导出按钮将其导出后注：博客：https://blog.csdn.net/badao_liumang_qizhi关注公众号霸道的程序猿获取编程相关电子书、教程推送与免费下载。实现首先下载jquery和jquery.table2excel的js文件，下载
  • 页面table导出Excel——table2excel plmzaqokn11 前台js插件
    1、下载table2Excel插件，https://github.com/rainabba/jquery-table2excel2、引入js3、html代码Column1Column2Column3Column4Column51aaacccdddeee3aaa34bbbcccddd修改22bbb22bbbcccdddeee5aaa55bbbcccdddeee4aaa44bbbcccdddeee4、
  • 前端导出excel兼容IE和主要浏览器 杨居易 前端内容
    前端导出excel兼容IE和主要浏览器前端导出excel所见即所得,比较简单,代码送上1.页面调用导出Excel//点击的时候打开table2excel方法其中里面的参数我放的是table里面的ID,总之能找到table就行2.scriptvaridTmr;//判断浏览器functiongetExplorer(){varexplorer=window.navigator.userAgent;//i
  • table2excel指定不导出某些列 tj146780 JavaScript
    有时候用table2excel导出excel的时候，希望不导出某一些列，除了可以用指定不导出类名之外，还可以这样functionExportExcel(DivName,fileName,cols){$(""+DivName).table2excel({exclude:".noExl",//过滤位置的css类名filename:""+fileName+".xls",//文件名称name:"Excel
  • pvtTable表格插件与table2excel表格下载 多多VS串串
    body{font-family:Verdana;}点击下载varutils=$.pivotUtilities;varheatmap=utils.renderers["Heatmap"];varsumOverSum=utils.aggregators["SumoverSum"];//生成表格$("#output").pivot(utils.tipsData,{rows:["sex","smoker
  • table2excel DeanWang
    要实现网页上的表格需要导出Excel，网上搜到的都是jquery的table2excel插件；但是其实这个插件rusty1s/table2excel更好用；使用久两句代码：functionexportExcel(tableid,filename){vartable2excel=newTable2Excel({defaultFileName:filename});table2excel.export
  • 如何将目标网页中的table导出成excel? NCUCoder 博客
    本文地址:https://hsowan.me/2019/08/30/table2excel/如何将目标网页中的table导出成excel?table2excel省略内容$(function(){$('#btn').click(function(){$('#example').table2excel({//不被导出的表格行的CSSclass类exclude:'.excludeThisClass',/
  • 页面table导出Excel——table2excel Index.Lin 前端js
    1、下载table2Excel插件，https://github.com/rainabba/jquery-table2excel2、引入js3、html代码Column1Column2Column3Column4Column51aaacccdddeee3aaa34bbbcccddd修改22bbb22bbbcccdddeee5aaa55bbbcccdddeee4aaa44bbbcccdddeee4、
  • 如何直接把table转换成Excel导出 Appinler JQuery
    $("#btn").click(function(){//绑定的click事件$("#table2excel").table2excel({//table标签的classexclude:".noExl",name:"ExcelDocumentName",filename:"wuliu_amount.xls",exclude_img:true,exclude_links:true,exclude_i
  • html table2png table2excel word ppt sql等 qq346625506 jquerytable2pngtable2exce
    JQuery-Plugin里面有两个文件夹，tableExport.jquery.plugin可以通过html的table导出很多类型文件XMLPNGCSVTXTSQLMS-WordMs-ExcelMs-PowerpointPDF相关用法可以参考：http://ngiriraj.com/pages/htmltable_export/demo.phpjquery-table2excel-master
  • html页面里table导出为excel messud4312 table2excel
    只要想不到，没有做不到，一直都不知道html里table元素可直接导出为excel，太牛逼了！这其中用到一个jquery的插件table2excel 使用方法也很简单：1。 包含必要的文件 2。创建导出按钮Export3。给导出按钮添加事件$(".table2excel").table2excel({   exclude: ".noExl",  // 不想导出的行加上class='noExl'即可
  • ztree设置禁用节点 3213213333332132 JavaScriptztreejsonsetDisabledNodeAjax
    ztree设置禁用节点的时候注意，当使用ajax后台请求数据,必须要设置为同步获取数据，否者会获取不到节点对象，导致设置禁用没有效果。 $(function(){ showTree(); setDisabledNode(); });
  • JVM patch by Taobao bookjovi javaHotSpot
    在网上无意中看到淘宝提交的hotspot patch，共四个，有意思，记录一下。   7050685：jsdbproc64.sh has a typo in the package name 7058036：FieldsAllocationStyle=2 does not work in 32-bit VM 7060619：C1 should respect inline and
  • 将session存储到数据库中 dcj3sjt126com sqlPHPsession
    CREATE TABLE sessions ( id CHAR(32) NOT NULL, data TEXT, last_accessed TIMESTAMP NOT NULL, PRIMARY KEY (id) );   <?php /** * Created by PhpStorm. * User: michaeldu * Date
  • Vector 171815164 vector
    public Vector<CartProduct> delCart(Vector<CartProduct> cart, String id) { for (int i = 0; i < cart.size(); i++) { if (cart.get(i).getId().equals(id)) { cart.remove(i);
  • 各连接池配置参数比较 g21121 连接池
            排版真心费劲，大家凑合看下吧，见谅~     Druid DBCP C3P0 Proxool 数据库用户名称 Username Username User   数据库密码 Password Password Password   驱动名
  • [简单]mybatis insert语句添加动态字段 53873039oycg mybatis
          mysql数据库,id自增,配置如下：       <insert id="saveTestTb" useGeneratedKeys="true" keyProperty="id" parameterType=&
  • struts2拦截器配置 云端月影 struts2拦截器
    struts2拦截器interceptor的三种配置方法 方法1. 普通配置法 <struts>     <package name="struts2" extends="struts-default">         &
  • IE中页面不居中，火狐谷歌等正常 aijuans IE中页面不居中
    问题是首页在火狐、谷歌、所有IE中正常显示，列表页的页面在火狐谷歌中正常，在IE6、7、8中都不中，觉得可能那个地方设置的让IE系列都不认识，仔细查看后发现，列表页中没写HTML模板部分没有添加DTD定义，就是<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3
  • String,int,Integer,char 几个类型常见转换 antonyup_2006 htmlsql.net
    如何将字串 String 转换成整数 int? int i = Integer.valueOf(my_str).intValue(); int i=Integer.parseInt(str); 如何将字串 String 转换成Integer ? Integer integer=Integer.valueOf(str); 如何将整数 int 转换成字串 String ? 1.
  • PL/SQL的游标类型 百合不是茶 显示游标(静态游标)隐式游标游标的更新和删除%rowtyperef游标(动态游标)
    游标是oracle中的一个结果集,用于存放查询的结果;   PL/SQL中游标的声明; 1,声明游标 2,打开游标(默认是关闭的); 3,提取数据 4,关闭游标     注意的要点:游标必须声明在declare中,使用open打开游标,fetch取游标中的数据,close关闭游标   隐式游标:主要是对DML数据的操作隐
  • JUnit4中@AfterClass @BeforeClass @after @before的区别对比 bijian1013 JUnit4单元测试
    一.基础知识 JUnit4使用Java5中的注解（annotation），以下是JUnit4常用的几个annotation： @Before：初始化方法   对于每一个测试方法都要执行一次（注意与BeforeClass区别，后者是对于所有方法执行一次）@After：释放资源  对于每一个测试方法都要执行一次（注意与AfterClass区别，后者是对于所有方法执行一次
  • 精通Oracle10编程SQL(12)开发包 bijian1013 oracle数据库plsql
    /* *开发包 *包用于逻辑组合相关的PL/SQL类型（例如TABLE类型和RECORD类型）、PL/SQL项（例如游标和游标变量）和PL/SQL子程序（例如过程和函数） */ --包用于逻辑组合相关的PL/SQL类型、项和子程序，它由包规范和包体两部分组成 --建立包规范：包规范实际是包与应用程序之间的接口，它用于定义包的公用组件，包括常量、变量、游标、过程和函数等 --在包规
  • 【EhCache二】ehcache.xml配置详解 bit1129 ehcache.xml
    在ehcache官网上找了多次，终于找到ehcache.xml配置元素和属性的含义说明文档了，这个文档包含在ehcache.xml的注释中！ ehcache.xml ： http://ehcache.org/ehcache.xml ehcache.xsd ： http://ehcache.org/ehcache.xsd ehcache配置文件的根元素是ehcahe   ehcac
  • java.lang.ClassNotFoundException: org.springframework.web.context.ContextLoaderL 白糖_ javaeclipsespringtomcatWeb
    今天学习spring+cxf的时候遇到一个问题：在web.xml中配置了spring的上下文监听器： <listener> <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class> </listener>  随后启动
  • angular.element boyitech AngularJSAngularJS APIangular.element
    angular.element 描述:     包裹着一部分DOM element或者是HTML字符串，把它作为一个jQuery元素来处理。（类似于jQuery的选择器啦）     如果jQuery被引入了，则angular.element就可以看作是jQuery选择器，选择的对象可以使用jQuery的函数；如果jQuery不可用，angular.e
  • java-给定两个已排序序列，找出共同的元素。 bylijinnan java
    import java.util.ArrayList; import java.util.Arrays; import java.util.List; public class CommonItemInTwoSortedArray { /** * 题目：给定两个已排序序列，找出共同的元素。 * 1.定义两个指针分别指向序列的开始。 * 如果指向的两个元素
  • sftp 异常，有遇到的吗？求解 Chen.H javajcraftauthjschjschexception
    com.jcraft.jsch.JSchException: Auth cancel at com.jcraft.jsch.Session.connect(Session.java:460) at com.jcraft.jsch.Session.connect(Session.java:154) at cn.vivame.util.ftp.SftpServerAccess.connec
  • [生物智能与人工智能]神经元中的电化学结构代表什么? comsci 人工智能
         我这里做一个大胆的猜想,生物神经网络中的神经元中包含着一些化学和类似电路的结构,这些结构通常用来扮演类似我们在拓扑分析系统中的节点嵌入方程一样,使得我们的神经网络产生智能判断的能力,而这些嵌入到节点中的方程同时也扮演着"经验"的角色....      我们可以尝试一下...在某些神经
  • 通过LAC和CID获取经纬度信息 dai_lm laccid
    方法1： 用浏览器打开http://www.minigps.net/cellsearch.html，然后输入lac和cid信息(mcc和mnc可以填0)，如果数据正确就可以获得相应的经纬度 方法2： 发送HTTP请求到http://www.open-electronics.org/celltrack/cell.php?hex=0&lac=<lac>&cid=&
  • JAVA的困难分析 datamachine java
    前段时间转了一篇SQL的文章（http://datamachine.iteye.com/blog/1971896），文章不复杂，但思想深刻，就顺便思考了一下java的不足，当砖头丢出来，希望引点和田玉。   -----------------------------------------------------------------------------------------
  • 小学5年级英语单词背诵第二课 dcj3sjt126com englishword
    money 钱 paper 纸 speak 讲，说 tell 告诉   remember 记得，想起 knock 敲，击，打 question 问题 number 数字，号码   learn 学会，学习 street 街道 carry 搬运，携带 send 发送，邮寄，发射   must 必须 light 灯，光线，轻的 front
  • linux下面没有tree命令 dcj3sjt126com linux
    centos p安装 yum -y install tree   mac os安装 brew install tree   首先来看tree的用法 tree 中文解释：tree 功能说明：以树状图列出目录的内容。 语　　法：tree [-aACdDfFgilnNpqstux][-I <范本样式>][-P <范本样式
  • Map迭代方式，Map迭代，Map循环 蕃薯耀 Map循环Map迭代Map迭代方式
    Map迭代方式，Map迭代，Map循环   >>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>> 蕃薯耀 2015年
  • Spring Cache注解+Redis hanqunfeng spring
    Spring3.1 Cache注解  依赖jar包： <!-- redis --> <dependency> <groupId>org.springframework.data</groupId> <artifactId>spring-data-redis</artifactId>
  • Guava中针对集合的 filter和过滤功能 jackyrong filter
    在guava库中，自带了过滤器(filter)的功能，可以用来对collection 进行过滤，先看例子：    @Test public void whenFilterWithIterables_thenFiltered() { List<String> names = Lists.newArrayList("John"
  • 学习编程那点事 lampcy 编程androidPHPhtml5
    一年前的夏天，我还在纠结要不要改行，要不要去学php？能学到真本事吗？改行能成功吗？太多的问题，我终于不顾一切，下定决心，辞去了工作，来到传说中的帝都。老师给的乘车方式还算有效，很顺利的就到了学校，赶巧了，正好学校搬到了新校区。先安顿了下来，过了个轻松的周末，第一次到帝都，逛逛吧！ 接下来的周一，是我噩梦的开始，学习内容对我这个零基础的人来说，除了勉强完成老师布置的作业外，我已经没有时间和精力去
  • 架构师之流处理---------bytebuffer的mark,limit和flip nannan408 ByteBuffer
    1.前言。   如题，limit其实就是可以读取的字节长度的意思，flip是清空的意思，mark是标记的意思 。 2.例子. 例子代码: String str = "helloWorld"; ByteBuffer buff = ByteBuffer.wrap(str.getBytes()); Sy
  • org.apache.el.parser.ParseException: Encountered " ":" ": "" at line 1, column 1 Everyday都不同 $转义el表达式
    最近在做Highcharts的过程中，在写js时，出现了以下异常：   严重: Servlet.service() for servlet jsp threw exception org.apache.el.parser.ParseException: Encountered " ":" ": "" at line 1,
  • 用Java实现发送邮件到163 tntxia java实现
    /* 在java版经常看到有人问如何用javamail发送邮件？如何接收邮件？如何访问多个文件夹等。问题零散，而历史的回复早已经淹没在问题的海洋之中。 本人之前所做过一个java项目，其中包含有WebMail功能，当初为用java实现而对javamail摸索了一段时间，总算有点收获。看到论坛中的经常有此方面的问题，因此把我的一些经验帖出来，希望对大家有些帮助。 此篇仅介绍用
  • 探索实体类存在的真正意义 java小叶檀 POJO
    一. 实体类简述    实体类其实就是俗称的POJO,这种类一般不实现特殊框架下的接口，在程序中仅作为数据容器用来持久化存储数据用的 POJO（Plain Old Java Objects）简单的Java对象   它的一般格式就是 public class A{ private String id; public Str
按字母分类： ABCDEFGHIJKLMNOPQRSTUVWXYZ其他