html5的导出表格功能
最近遇到一个需要导出表格的需求,研究了一下nodeJs的excel模块及好多其他的插件,发现还是蛮复杂的,由于项目对于表格的要求不高,因此同事推荐了一种h5的表格导出生成方法,比较简单,在此记录一下
先上代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<a id="test" onclick="clickDownload(this)" download="downlaod.csv" href="#">download</a>
</body>
</html>
<script>
function clickDownload(aLink)
{
var str = "栏位1,栏位2,栏位3\n值1,值2,值3";
str = encodeURIComponent(str);
aLink.href = "data:text/csv;charset=utf-8,\ufeff"+str;
// aLink.click();
}
</script>
十分简单,如果是表格试的页面,只要获取对应的tr,遍历其中的td拼成字符串,传入其中即可。只要是支持H5的浏览器都可以用
html5的导出表格功能的更多相关文章
- vue中使用导出表格功能
1.下载依赖 npm install -S file-saver xlsx npm install -D script-loader 2.在src下创建vendor文件夹,并在文件夹中放两个文件 Bl ...
- html table表格导出excel的方法 html5 table导出Excel HTML用JS导出Excel的五种方法 html中table导出Excel 前端开发 将table内容导出到excel HTML table导出到Excel中的解决办法 js实现table导出Excel,保留table样式
先上代码 <script type="text/javascript" language="javascript"> var idTmr; ...
- EasyUi通过POI 实现导出xls表格功能
Spring +EasyUi+Spring Jpa(持久层) EasyUi通过POI 实现导出xls表格功能 EasyUi界面: 点击导出按钮实现数据导入到xls表格中 第一步:修改按钮事件: @Co ...
- vue中把table导出表格excel
1.首先下载2个js,我的百度网盘有 2.安装依赖 npm install -S file-saver xlsx(这里其实安装了2个依赖) npm install -D script-loader 3 ...
- C# DevExpress GridControl导出表格【转】
DevExpress的GridControl提供方便的数据导出功能,可以方便的导出Exce,PDF,Html页面,world形式,无需写额外的代码,方便.快捷. /// <summary> ...
- Atitit.导出excel功能的设计 与解决方案
Atitit.导出excel功能的设计 与解决方案 1.1. 项目起源于背景1 1.2. Js jquery方案(推荐)jquery.table2excel1 1.3. 服务器方案2 1.4. 详细 ...
- 用这个库 3 分钟实现让你满意的表格功能:Bootstrap-Table
本文作者:HelloGitHub-kalifun 这是 HelloGitHub 推出的<讲解开源项目>系列,今天给大家推荐一个基于 Bootstrap 和 jQuery 的表格插件:Boo ...
- php导出表格两种方法 ——PhpExcel的列子
php常用的导出表格有两种方法,第一种是输出表格,这种方法打开的时候有警告提示,一般导出表格会用phpexcel,这个导出比较灵活,而且还可以设置表格的样式. 第一种导出例子 /** * 执行导出 * ...
- 关于Java中excel表格导出的总结(Java程序导出模板和Java根据模板导出表格两种实现方式)
导出excel通用模板(程序定义模板导出) 转载原文:https://www.jianshu.com/p/5c7b359a159c 如下代码,本方法主要用于程序定义模板格式,并导出文件.该方法将定义和 ...
随机推荐
- 金蝶Apusic中间件适配JetSpeed2过程记录
金蝶Apusic中间件适配JetSpeed2过程记录: 1.安装金蝶并配置域,确保域运行正常. 2.参考<JetSpeed2部署至Apusic操作步骤记录>进行应用迁移. https:// ...
- hdu 1979 DFS + 字典树剪枝
http://acm.hdu.edu.cn/showproblem.php?pid=1979 Fill the blanks Time Limit: 3000/1000 MS (Java/Others ...
- 深入理解spark streaming
spark streaming是建立在spark core之上的,也就说spark streaming任务最终执行还是依赖于RDD模型.在转化成最终的RDD模型执行前,spark streaming主 ...
- Split方法,拆分字符串后,去除返回的空值
我们在使用Split('')方法的时候,根据指定的 '字符' 对字符串进行拆分,当'字符’为最后一个,将会拆分一个空值进行返回. 这个时候我们可以使用 string.Split(new ch ...
- SPI总线小结
串行外设接口(Serial Peripheral Interface,SPI)的缩写.是一种高速的,全双工,同步的通信总线,并且在芯片的管脚上只占用四根线.Motorola首先在其MC68HCXX系列 ...
- Vue 组件 data为什么是函数
在创建或注册模板的时候,传入一个data属性作为用来绑定的数据.但是在组件中,data必须是一个函数,而不能直接把一个对象赋值给它. Vue.component('my-component', { t ...
- 51nod 1067 Bash游戏 V2
基准时间限制:1 秒 空间限制:131072 KB 分值: 10 难度:2级算法题 有一堆石子共有N个.A B两个人轮流拿,A先拿.每次只能拿1,3,4颗,拿到最后1颗石子的人获胜.假设A B都非常聪 ...
- umask命令
umask——显示.设置文件的缺省权限 the user file-creation mask 命令所在路径:Shell内置命令 示例1:显示缺省权限 # umask -S 参数S的作用是以rwx形式 ...
- Model 模型
Model 模型模型是你的数据的唯一的.权威的信息源.它包含你所存储的数据的必要字段和行为.通常,每个模型对应数据库中唯一的一张表. 每个模型都是dhango.db.models.Model 的一个P ...
- uva10163 Storage Keepers
习题9-9 注意前提是最小值最大.很少做两次dp的题. 初始化要细心. #include<iostream> #include<cmath> #include<algor ...