前端js实现打印excel表格
产品原型:

功能需求:点击导出考勤表格按钮,会自动下载成Excel格式


jsp页面代码:
<div class="tools">
<button type="button" class="btn green" id="excell" onclick="method5('dataTable')">导出考勤表</button>
</div>
js代码
//打印表格
var idTmr;
function getExplorer() {
var explorer = window.navigator.userAgent ;
//ie
if (explorer.indexOf("MSIE") >= 0) {
return 'ie';
}
//firefox
else if (explorer.indexOf("Firefox") >= 0) {
return 'Firefox';
}
//Chrome
else if (explorer.indexOf("Chrome") >= 0) {
return 'Chrome';
}
//Opera
else if (explorer.indexOf("Opera") >= 0) {
return 'Opera';
}
//Safari
else if (explorer.indexOf("Safari") >= 0) {
return 'Safari';
}
}
function method5(tableid) {
if (getExplorer() == 'ie') {
var curTbl = document.getElementById(tableid);
var oXL = new ActiveXObject("Excel.Application");
var oWB = oXL.Workbooks.Add();
var xlsheet = oWB.Worksheets(1);
var sel = document.body.createTextRange();
sel.moveToElementText(curTbl);
sel.select();
sel.execCommand("Copy");
xlsheet.Paste();
oXL.Visible = true;
try {
var fname = oXL.Application.GetSaveAsFilename("Excel.xls",
"Excel Spreadsheets (*.xls), *.xls");
} catch (e) {
print("Nested catch caught " + e);
} finally {
oWB.SaveAs(fname);
oWB.Close(savechanges = false);
oXL.Quit();
oXL = null;
idTmr = window.setInterval("Cleanup();", 1);
}
} else {
tableToExcel(tableid)
}
}
function Cleanup() {
window.clearInterval(idTmr);
CollectGarbage();
}
var tableToExcel = (function() {
var uri = 'data:application/vnd.ms-excel;base64,', template = '<html><head><meta charset="UTF-8"></head><body><table border="1">{table}</table></body></html>', base64 = function(
s) {
return window.btoa(unescape(encodeURIComponent(s)))
}, format = function(s, c) {
return s.replace(/{(\w+)}/g, function(m, p) {
return c[p];
})
}
return function(table, name) {
if (!table.nodeType)
table = document.getElementById(table)
var ctx = {
worksheet : name || 'Worksheet',
table : table.innerHTML
}
window.location.href = uri + base64(format(template, ctx))
}
})()
完整的可复制黏贴的demo:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div class="tools">
<button type="button" class="btn green" id="excell" onclick="method5('dataTable')">导出考勤表格</button>
</div>
<table border="1" id="dataTable">
<tr>
<td>王婷111</td>
<td>一见倾城333 </td>
</tr>
<tr>
<td>祈澈姑娘222</td>
<td>Python开发者交流平台44</td>
</tr>
<tr>
<td>wwwangting888</td>
<td>13661725475</td>
</tr>
</table>
</body>
<script>
//打印表格
var idTmr;
function getExplorer() {
var explorer = window.navigator.userAgent;
//ie
if(explorer.indexOf("MSIE") >= 0) {
return 'ie';
}
//firefox
else if(explorer.indexOf("Firefox") >= 0) {
return 'Firefox';
}
//Chrome
else if(explorer.indexOf("Chrome") >= 0) {
return 'Chrome';
}
//Opera
else if(explorer.indexOf("Opera") >= 0) {
return 'Opera';
}
//Safari
else if(explorer.indexOf("Safari") >= 0) {
return 'Safari';
}
}
function method5(tableid) {
if(getExplorer() == 'ie') {
var curTbl = document.getElementById(tableid);
var oXL = new ActiveXObject("Excel.Application");
var oWB = oXL.Workbooks.Add();
var xlsheet = oWB.Worksheets(1);
var sel = document.body.createTextRange();
sel.moveToElementText(curTbl);
sel.select();
sel.execCommand("Copy");
xlsheet.Paste();
oXL.Visible = true;
try {
var fname = oXL.Application.GetSaveAsFilename("Excel.xls",
"Excel Spreadsheets (*.xls), *.xls");
} catch(e) {
print("Nested catch caught " + e);
} finally {
oWB.SaveAs(fname);
oWB.Close(savechanges = false);
oXL.Quit();
oXL = null;
idTmr = window.setInterval("Cleanup();", 1);
}
} else {
tableToExcel(tableid)
}
}
function Cleanup() {
window.clearInterval(idTmr);
CollectGarbage();
}
var tableToExcel = (function() {
var uri = 'data:application/vnd.ms-excel;base64,',
template = '<html><head><meta charset="UTF-8"></head><body><table border="1">{table}</table></body></html>',
base64 = function(
s) {
return window.btoa(unescape(encodeURIComponent(s)))
},
format = function(s, c) {
return s.replace(/{(\w+)}/g, function(m, p) {
return c[p];
})
}
return function(table, name) {
if(!table.nodeType)
table = document.getElementById(table)
var ctx = {
worksheet: name || 'Worksheet',
table: table.innerHTML
}
window.location.href = uri + base64(format(template, ctx))
}
})()
</script>
</html>
前端js实现打印excel表格的更多相关文章
- 【面试题】js实现将excel表格copy到页面
js实现将excel表格copy到页面 点击打开视频讲解更加详细 其实最核心的技术,还是copy的是我们粘贴板上的数据 就像平常怎么粘贴复制其他的数据一样,只是我们在excel粘贴的是一个表格数据 这 ...
- 前端js实现打印(导出)excel表格
产品原型: 图片.png 功能需求:点击导出考勤表格按钮,会自动下载成Excel格式 图片.png 图片.png jsp页面代码: <div class="tools"> ...
- 使用Windows驱动的虚拟打印机,打印Excel表格无表格线问题解决(2)
测试: 经前天的测试,最终还是没有明显的定夺到底是驱动的问题,还是打印机的问题.但是按照可能性来排查,最明显的一点就是其他测试环境不变的情况下增加一张图片,就可以打印出表格线,我始终觉得这里是突破点, ...
- 【翻译】将Ext JS Grid转换为Excel表格
原文:Converting an Ext 5 Grid to Excel Spreadsheet 稍微迟来的礼物--Ext JS Grid转为Excel代码,现在支持Ext JS 5! 功能包括: - ...
- 前端JS脚本将网页表格导出为Excel
话不多说,上代码! <!DOCTYPE> <html> <head> <title>Excel Test</title> </head ...
- 【JS】打印Excel——ActiveX控件
function viewToExcel(){ var filepath = "f:\\PrinterExcel.xls"; var xlApp; var xlBook; var ...
- web前端js 实现打印操作
转载来源:https://www.cnblogs.com/potatog/p/7412905.html 一.打印当前页面指定元素中的内容 方式一:直接使用window.print(); (1)首先获得 ...
- 小谢第10问:前端JS下载文件、表格
对于小型文件及表格下载,一般采用a标签形式 <buttonb @click="downloadTemplate()">模板下载</button> downl ...
- JS导入导出Excel表格的方法
https://blog.csdn.net/aa122273328/article/details/50388673 导出 https://blog.csdn.net/qq_37281252/arti ...
随机推荐
- jquery init 关系
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/st ...
- 使用SqlBulkCopy进行批量数据插入
Dim dt As DataTable = New DataTable() dt.Columns.Add("DtCostProductRuleGUID", GetType(Guid ...
- CISP/CISA 每日一题 10
CISA 每日一题(答)一个合理建造的数据仓库应当支持下列三种基本的查询格式: 1.向上溯源和向下溯源——向上溯源是对数据进行总计:向下溯源是将数据进行细化: 2.交叉溯源——通过通用属性访问数据仓库 ...
- C++ 指针与引用 知识点 小结
[摘要] 指针能够指向变量.数组.字符串.函数.甚至结构体.即指针能够指向不同数据对象.指针问题 包含 常量指针.数组指针.函数指针.this指针.指针传值.指向指针的指针 等. 主要知识点包含:1. ...
- [Node & Tests] Intergration tests for Authentication
For intergration tests, always remember when you create a 'mass' you should aslo clean up the 'mass' ...
- PMP杂谈--名词解释
过程:PMP中常常提到过程,好像非常高大上,实则不然,过程说白了就是一系列的行动和活动,用来创建预定的产品,服务或成果. 就这么简单. 再深入点就是,行动和活动当然都会有ITTO(输入,工具和技术.输 ...
- 1.1 Introduction中 Consumers官网剖析(博主推荐)
不多说,直接上干货! 一切来源于官网 http://kafka.apache.org/documentation/ Consumers 消费者(Consumers) Consumers label t ...
- python缩进报错
1.这个错误应该已经好久了:也应该熟悉了才对 IndentationError: unexpected indent python 缩进错误:意外缩进Python 但今天的问题有点特殊,我想在程序中间 ...
- android--显式跳转和隐式跳转的差别使用方法
#创建第二个activity * 新创建的activity.必须在清单文件里做配置,否则系统找不到,在显示时会直接报错 <activity android:name="com.ithe ...
- (笑话)切,我也是混血儿,我爸是A型血,我妈是B型血!
1.中午,在家里看电视,电视里正在说起食品安全问题.侄儿突然感叹道:“现在的食品真不让人放心啊!”嘿,没想到侄儿小小年纪竟有这般认识,我正要抓住机会教育他不要乱吃零食.这时侄儿幽怨的瞪着我说:“我昨晚 ...