将页面table内容与样式另存成excel文件的方法


Posted in Javascript onAugust 05, 2015

在项目做完之余,测试最近做的一个论坛,其中有个导出功能,发现点击网页导出按钮之后,将页面的table内容另存为excel文件后,却发现无法保存表格样式,经过问题分析之后找到根本原因,下面小编就把我的实现思路给大家分享如下:

问题描述:

问题分析过程:

   1.table表格用class,而不是style。导出时并没有导出class定义,若换成style,将颜色样式直接写在style中,就会导出样式。

    style是样式,在HTML中用这个来标明属性样式,是css中的内容,而class是类,申明和定义里面的内容,导出页面时并不会导出定义即class所定义的样式。

  2.将类定义放到table中也可以导出样式

下面通过两种方案解决此问题。

处理方案一:

   将class="${getClass()}"换成style="color:${getStyle()};"

补充:

$('#export').click(function () {
 saveAsExcel($('h3').text(), $('#table').html().replace(/( )+/gi,''));
 });

其中excel只识别table,使用saveAsExcel方法自动另存时,class定义保存不了;如果手工拷贝粘贴到excel时,class定义就能保存了。
主要还是手工与自动拷贝粘贴问题

处理方案二:

将在<head><style></style></head>中定义的类移动到<table></table>之间即可。类定义样式的位置问题

以上内容就是本文的全部内容,希望大家喜欢。

Javascript 相关文章推荐
IE中radio 或checkbox的checked属性初始状态下不能选中显示问题
Jul 25 Javascript
js arguments对象应用介绍
Nov 28 Javascript
使用Java实现简单的server/client回显功能的方法介绍
May 03 Javascript
如何在MVC应用程序中使用Jquery
Nov 17 Javascript
基于jquery实现最简单的选项卡切换效果
May 08 Javascript
基于BootStrap Metronic开发框架经验小结【二】列表分页处理和插件JSTree的使用
May 12 Javascript
浅析Ajax语法
Dec 05 Javascript
使用ES6语法重构React代码详解
May 09 Javascript
详解VueJs前后端分离跨域问题
May 24 Javascript
详解vue-cli 3.0 build包太大导致首屏过长的解决方案
Nov 10 Javascript
简单两步使用node发送qq邮件的方法
Mar 01 Javascript
Vue+Koa2 打包后进行线上部署的教程详解
Jul 31 Javascript
JS模拟键盘打字效果的方法
Aug 05 #Javascript
js点击列表文字对应该行显示背景颜色的实现代码
Aug 05 #Javascript
JS使用parseInt解析数字实现求和的方法
Aug 05 #Javascript
js绘制圆形和矩形的方法
Aug 05 #Javascript
JavaScript实现自动消除按钮功能的方法
Aug 05 #Javascript
JS版元素周期表实现方法
Aug 05 #Javascript
javascript实现手机震动API代码
Aug 05 #Javascript
You might like
PHP5.3安装Zend Guard Loader图文教程
2014/09/29 PHP
php表单提交与$_POST实例分析
2015/01/26 PHP
thinkPHP简单调用函数与类库的方法
2017/03/15 PHP
javascript(jquery)利用函数修改全局变量的代码
2009/11/02 Javascript
JavaScript栏目列表隐藏/显示简单实现
2013/04/03 Javascript
javascript 函数声明与函数表达式的区别介绍
2013/10/05 Javascript
JavaScript中的object转换函数toString()与valueOf()介绍
2014/12/31 Javascript
javascript实现checkBox的全选,反选与赋值
2015/03/12 Javascript
Jquery+Ajax+PHP+MySQL实现分类列表管理(上)
2015/10/28 Javascript
js倒计时简单实现代码
2016/08/11 Javascript
hovertree插件实现二级树形菜单(简单实用)
2016/12/28 Javascript
vux uploader 图片上传组件的安装使用方法
2018/05/15 Javascript
vue移动端实现红包雨效果
2020/06/23 Javascript
Vue实现自定义下拉菜单功能
2018/07/16 Javascript
vue项目中使用Hbuilder打包app 设置沉浸式状态栏的方法
2018/10/22 Javascript
小程序自定义模板实现吸顶功能
2020/01/08 Javascript
vue中的过滤器及其时间格式化问题
2020/04/09 Javascript
vue-preview动态获取图片宽高并增加旋转功能的实现
2020/07/29 Javascript
在Python web中实现验证码图片代码分享
2017/11/09 Python
python机器学习理论与实战(一)K近邻法
2021/01/28 Python
python3+PyQt5实现柱状图
2018/04/24 Python
pygame游戏之旅 添加碰撞效果的方法
2018/11/20 Python
PyQt5内嵌浏览器注入JavaScript脚本实现自动化操作的代码实例
2019/02/13 Python
Python----数据预处理代码实例
2019/03/20 Python
详解CSS3中常用的样式【基本文本和字体样式】
2020/10/20 HTML / CSS
CSS3 真的会替代 SCSS 吗
2021/03/09 HTML / CSS
html5移动端价格输入键盘的实现
2019/09/16 HTML / CSS
接口可以包含哪些成员
2012/09/30 面试题
JAVA程序设计笔试题面试题一套
2015/07/28 面试题
车辆维修工自我评价怎么写
2013/09/20 职场文书
英语自荐信范文
2013/12/11 职场文书
党员自我评议对照检查材料
2014/09/27 职场文书
2015年世界环境日演讲稿
2015/03/18 职场文书
送给小学生的暑假礼物!小学生必背99首古诗
2019/07/02 职场文书
python Tkinter的简单入门教程
2021/04/11 Python
python+pyhyper实现识别图片中的车牌号思路详解
2022/12/24 Python