工作中遇到一需求,要将后台的表格导出到excel后的表格样式该如何修改呢?

其实表格导出首先需要了解两个插件:jquery.table2excel.js和tableExport.js

1、第一步,写一个导出按钮button

<button id="datatable">导出</button>

2、第二步,初始化js

①jquery.table2excel.js

$('button').click(function(){
$("#datatable").table2excel({
exclude: ".noExl",
name: "Excel Document Name",
filename: "myFileName", //此处为导出的文件名
exclude_img: true,
exclude_links: true,
exclude_inputs: true
///////此处的配置项可以根据需求配置
});
})

②tableExport.js

$("button").click(function(){
$('#datatable').tableExport({
type:'excel',
escape:'false',
fileName: 'myFileName'//此处为导出的文件名
///////此处的配置项可以根据需求配置
});
});

3、如果导出的表格的样式无法导出到excel,需要自己在js里写,如下图



4、最后在HTML文件中引入相对应的js文件即可。

表格导出到excel的样式消失该如何修改的更多相关文章

  1. 使用JavaScript把页面上的表格导出为Excel文件

    如果在页面上展示了一个数据表格,而用户想把这个表格导出为Excel文件,那么在要求不高的情况下,可以不通过服务器生成表格,而是直接利用JavaScript的Blob和Object URL特性将表格导出 ...

  2. JS 将页面上的表格导出为 Excel 文件

    如果在页面上展示了一个表格,想把这个表格导出为Excel文件,那么在要求不高的情况下,可以直接利用 JavaScript 的 Blob 和 Object URL 特性将表格导出.不过,这就是利用了 E ...

  3. 纯JS 将table表格导出到excel

    html <div > <button type="button" onclick="getXlsFromTbl('tableExcel','myDiv ...

  4. 将HTML表格导出到EXCEL,兼容Firefox,支持中文

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 网站开发进阶(三十一)js如何将html表格导出为excel文件(后记)

    js如何将html表格导出为excel文件(后记) 前言 项目前期做了个导出Excel表格的功能,但是经过测试发现只有在IE上才可以正确实现,在Chrome等浏览器中无法实现导出效果.经过上网搜索,尝 ...

  6. 网站开发进阶(二十五)js如何将html表格导出为excel文件

    js如何将html表格导出为excel文件        赠人玫瑰,手留余香.若您感觉此篇博文对您有用,请花费2秒时间点个赞,您的鼓励是我不断前进的动力,共勉! jsp页面数据导出成excel的方法很 ...

  7. vue将表格导出为excel

    vue将表格导出为excel 一:在项目中需要安装2个依赖项,如下命令: npm install --save file-saver xlsx 二:在vue文件中如下使用即可: <templat ...

  8. 将表格导出为excel

    <table id="tableExcel" border="1"> <tr> <th>零</th> <t ...

  9. html页面表格导出到excel总结

    转载:http://www.cnblogs.com/liuguanghai/archive/2012/12/31/2840262.html <table id="tableExcel& ...

随机推荐

  1. 【Tomcat】tomcat7 设置成系统服务启动

    1.启动cmd 2.cd C:\Program Files\tomcat7\bin 3.service.bat install 4.打开tomcat7w.exe可以启动管理服务

  2. 阿里云VS腾讯云 谁才是中国未来的云计算之王?

    阿里云早在 2009 年就已经开始布局云计算领域,具有先发优势.据统计,40% 的中国 500 强企业.近一半中国上市公司.80% 中国科技类公司是阿里云的客户.而腾讯云基于腾讯自身在游戏.视频.社交 ...

  3. 52个有效方法(1) - 了解Objective-C语言的起源

    Objective-C语言使用的是"消息结构"而非"函数调用" "消息结构"和"函数调用"之间的区别 "消息结 ...

  4. XCTF-CAT

    果然还是我太菜了呜呜呜,这道题仍然是没有自己做出来.哎. 这一道用的并不是PHP的环境,而是用Python中的Django编写的. 记得做过类似的一道题目.来源于MOCTF中的网站扫描器,当时做完后其 ...

  5. Linux学习资料网站汇总链接(持续更新ing)

    排名不分先后. 学海无涯苦作舟. 博客: 1.slmba:LINUX博客原创大牛 2.edsionte's TechBlog:Linuxer (他的友情链接中还有一堆Linuxer,被公司屏蔽进不去. ...

  6. SSH服务协议

    1.SSH介绍: SSH 是Secure Shell Protocol 的简写,由IETF网络小组(Network Working Group)制定:在进行数据传输之前,SSH先对联机数据包通过加密技 ...

  7. python urllib2实现http GET PUT DELETE POST的方法

    #!/usr/bin/env python # -*- coding: utf-8 -*- # @Time : 2019/3/11 下午8:33 # @Author : liubing # @File ...

  8. ToShowDoc拯救不想写文档的你

    ToShowDoc拯救不想写文档的你 写注释已经够折磨开发者了,显然天天curd的我们再去写文档岂不是分分种要被逼疯. 我想每个人都有这种经历 加了一个参数文档忘了更新 参数名更改文档忘了更新 删掉一 ...

  9. postman环境变量设置

    1.点击小齿轮进入到环境变量添加页面,点击add添加环境变量 2.输入变量名称和变量值 3.添加成功 4.接口中设置变量

  10. 常见PHP危险函数及特殊函数

    PHP代码执行函数 - eval & assert & preg_replace mixed eval ( string $code ) 把字符串 $code 作为PHP代码执行. 很 ...