有时候的需求是从后台获取数据,然后将数据变成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. 【service调用dao层传参的三种方式】

    第一种方案:默认数组角标: service Public User selectUser(String name,String area); mapper: <select id="s ...

  2. Mathematics Base - 期望、方差、协方差、相关系数总结

    参考:<深度学习500问> 期望 ​在概率论和统计学中,数学期望(或均值,亦简称期望)是试验中每次可能结果的概率乘以其结果的总和.它反映随机变量平均取值的大小. 线性运算: \(E(ax+ ...

  3. ASP.NET MVC 小牛之旅2:体验第一个MVC程序

    了解了什么是MVC之后,接下来用一个非常简单的留言板程序概要的了解MVC网站开发的过程,对MVC开发有个大致的轮廓.第一个项目将不会提到过多与数据库相关的技术,因此将以Framework Code F ...

  4. [CentOS7] 使用磁盘分割建立swap

    声明:本文主要总结自:鸟哥的Linux私房菜-第七章.Linux 磁碟與檔案系統管理,如有侵权,请通知博主 通过 vim /etc/fstab 使该新建的swap分区每次开机都自己挂载 至此,已经完成 ...

  5. 51nod1307(暴力树剖/二分&dfs/并查集)

    题目链接: http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1307 题意: 中文题诶~ 思路: 解法1:暴力树剖 用一个数 ...

  6. 洛谷P3387 缩点模板

    给定一个n个点m条边有向图,每个点有一个权值,求一条路径,使路径经过的点权值之和最大.你只需要求出这个权值和. 允许多次经过一条边或者一个点,但是,重复经过的点,权值只计算一次. 因为可以重复经过点, ...

  7. [Xcode 实际操作]四、常用控件-(1)UIButton控件的使用

    目录:[Swift]Xcode实际操作 本文将演示按钮控件的使用,按钮是用户界面中最常见的交互控件 在项目导航区,打开视图控制器的代码文件[ViewController.swift] import U ...

  8. SKlearn中分类决策树的重要参数详解

    学习机器学习童鞋们应该都知道决策树是一个非常好用的算法,因为它的运算速度快,准确性高,方便理解,可以处理连续或种类的字段,并且适合高维的数据而被人们喜爱,而Sklearn也是学习Python实现机器学 ...

  9. SpringMVC 思想介绍

    MVC 思想简介 博客园好像不支持发布markdown的时序图, 如果你会markdown并且不太熟悉Springmvc执行流程, 照着图在Markdown上面敲一遍执行流程,这是我经历过的最快的记忆 ...

  10. java.lang.ClassCastException: java.util.ArrayList cannot be cast to com.github.pagehelper.Page

    出现这个错误,首先看配置mybatis-config.xml中的<plugins> <plugin interceptor="com.github.pagehelper.P ...