有时候的需求是从后台获取数据，然后将数据变成execl，进行导出，下载成execl 解决的方法是

一,比较方便的是

这有个插件 可以直接用

https://www.npmjs.com/package/xlsx

二,这种是自己写的一种

1.渲染数据的模板

<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">

<head>

<meta charset="utf-8" />

<!--[if gte mso 9]>

<xml>

<x:ExcelWorkbook>

<x:ExcelWorksheets>

<x:ExcelWorksheet>

<x:Name><%=sheetName%></x:Name>

<x:WorksheetOptions>

<x:DisplayGridlines/>

</x:WorksheetOptions>

</x:ExcelWorksheet>

</x:ExcelWorksheets>

</x:ExcelWorkbook>

</xml><![endif]-->

</head>

<body><%=tableHTML%>

</body>

</html>

2.点击导出execl 点击导出按钮 然后执行这个函数

// 导出文件

		clickExport : function(event) {

		    var _this=this;

		    this.renderTable(function(){

			// 获取当前的图表类型

			var type = 'table';

			// sheet名称

			var sheetName = '专利信息汇总表 ';

			if (type == "table") {

				_this.exportExcel(sheetName, _this.$(".execltable").find("table"), event);

			}

		    });

		},

		// 导出为excel文件

		exportExcel : function(sheetName, $table, event) {

			var base64 = window.btoa(unescape(encodeURIComponent(this.tableExcelTemplate({

				sheetName : sheetName,

				tableHTML : $table.prop("outerHTML")

			}))));

			// 获取下载链接

			var uri = 'data:application/vnd.ms-excel;base64,' + base64;

			// 设置下载名称

			event.target.download = sheetName + ".xls";

			// 触发下载

			event.target.href = uri;

		},

		renderTable:function(callback){

		    var result=this.tableView.getDataExecl();

		    this.$(".execltable").html(this.tableTemplate({

			rows:result

		    }));

		    callback();

		},

　　

　

将表格table作为execl导出的更多相关文章

  1. Html Table用JS导出excel格式问题 导出EXCEL后单元格里的000412341234会变成412341234 7-14 会变成 2018-7-14(7月14) 自定义格式 web利用table表格生成excel格式问题 js导出excel增加表头、mso-number-format定义数据格式 数字输出格式转换 mso-number-format:"\@"

    Html Table用JS导出excel格式问题 我在网上找的JS把HTML Tabel导出成EXCEL.但是如果Table里的数字内容为0开的的导成Excel后会自动删除0,我想以text的格式写入 ...

  2. vue中excal表格的导入和导出

    注意:vue中要实现表格的导入与导出,首先要install两个依赖, npm install -S file-saver xlsx  和  npm install -D script-loader.其 ...

  3. jQuery动态对表格Table进行添加或删除行以及修改列值操作

    jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...

  4. BootStrap入门教程 (二) ：BASE CSS（排版(Typography),表格(Table),表单(Forms),按钮(Buttons)）

    上讲回顾:Bootstrap的手脚架(Scaffolding)提供了固定(fixed)和流式(fluid)两种布局,它同时建立了一个宽达940px和12列的格网系统. 基于手脚架(Scaffoldin ...

  5. html表格table设置边框

    对于很多初学HTML的人来说,表格<table>是最常用的标签了,但对于表格边框的控制,很多初学者却不甚其解. 一般我们用表格的时候总会给它个border属性,比如:<table b ...

  6. css列表list、表格table

    列表list,无序列表ul,有序列表ol 1.列表项样式list-style-type 无列表默认为dist实心圆,有序列表默认为decimal阿拉伯数字(前面不带0) 其他无序列表常用none无样式 ...

  7. 表格(Table)隔行变色

    在ASP.NET的Repeater控件,实现隔行变色,是极简单的事情.因为它有ListItemType.Item和ListItemType.AlternatingItem模版.如果在普通的表格(Tab ...

  8. pre,html转义，abbr缩写，表格table

    <pre></pre>预定义文本标签pre(保留换行和空格) <sdds>对html转义 <abbr title="sddsdsds"&g ...

  9. 表格Table宽度设置无效的解决方法

    表格Table宽度设置无效的解决方法 bootstrap中使用table时发现不管用width赋值方式都无法改变table>td的宽度 解决方法: 设置table:table-layout:fi ...

随机推荐

  1. api接口访问限制

    1.场景描述 在日常开发接口的时候,尤其是restfull接口,肯定会考虑安全或者是做一些自定义的限制,用来界定并维护代码.那么,我们都会采用什么方法那?通常来讲,我们可以通过session的形式,以 ...

  2. Logstash过滤插件

    filter初级 Logstash安装 ### 设置YUM源 # rpm --import https://artifacts.elastic.co/GPG-KEY-elasticsearch # t ...

  3. THE WAY TO HACKER

    1/编程篇88课时(预计三个月) 此阶段主要侧重于培养学员发现问题的能力,并对各大平台各个操作系统有一个整体性认知,迅速建立起较高的计算机素养,并形成对于信息安全核心思想的初步探索及认知,为后续专项课 ...

  4. c++第六次实验

    part 1 验证性实验 合并两个文件.虽说验证,但后两个实验均受该代码指导启发. part 2  文末添加数据 1.代码 #include<fstream> #include<io ...

  5. centos 7.X关闭防火墙和selinux

    一.关闭防火墙 centos从7开始默认用的是firewalld,这个是基于iptables的,虽然有iptables的核心,但是iptables的服务是没安装的. 所以你只要停止firewalld服 ...

  6. Jdk升级到11引起的问题：程序包javax.xml.bind.annotation不存在

    Jdk12 都发布了, 我也下载一个玩一玩吧.刚准备要下载,发现之前已经下载了一个11, 那就11 吧,也不用太新了. 安装了jdk11,习惯性的设置了一下环境变量: JAVA_HOME=D:\too ...

  7. 记一次工作中的小BUG

    今天在调试代码的时候总是遇到一个bug,百思不得其解!先上bug图 我用的webapi 集成的swagger,错误提示是路由名称冲突,可我仔细检查了下并没有冲突的路由地址啊!于是上网查找资料,有位网友 ...

  8. angularJs1.x 版本中 uib-tabset 如何默认激活不同的标签页

     <uib-tabset> 默认有个active属性,根据官方文档,active的默认值是0,也就是说,默认显示索引为0的标签页,可以通过修改这个值来默认显示不同的索引的标签页. 示例: ...

  9. POJ 2068 NIm (dp博弈，每个人都有特定的取最大值）

    题目大意: 有2n个人,从0开始编号,按编号奇偶分为两队,循环轮流取一堆有m个石子的石堆,偶数队先手,每个人至少取1个,至多取w[i]个,取走最后一个石子的队伍输.问偶数队是否能赢. 分析: 题目数据 ...

  10. LeetCode 260 Single Number III 数组中除了两个数外，其他的数都出现了两次，找出这两个只出现一次的数

    Given an array of numbers nums, in which exactly two elements appear only once and all the other ele ...