热门关键字:
jquery > jquery教程 > html5 > 多个浏览器下应用前端JS实现一键导出excel表

多个浏览器下应用前端JS实现一键导出excel表

371
作者:管理员
发布时间:2020/3/16 10:27:15
评论数:0
转载请自觉注明原文:http://www.jq-school.com/Show.aspx?id=1047

  自己试验了几种方法,找到一种较为全面的一种方式一键输出Excel表格,代码如下

  1<!DOCTYPEhtml>

  2<html>

  3<headlang="en">

  4<metacharset="UTF-8">

  5<title>导出表格</title>

  6<scriptlanguage="JavaScript"type="text/javascript">

  7varTmr;

  8functiongetExplorer(){

  9varexplorer=window.navigator.userAgent;

  10//ie

  11if(explorer.indexOf("MSIE")>=0){

  12return'ie';

  13}

  14//firefox

  15elseif(explorer.indexOf("Firefox")>=0){

  16return'Firefox';

  17}

  18//Chrome

  19elseif(explorer.indexOf("Chrome")>=0){

  20return'Chrome';

  21}

  22//Opera

  23elseif(explorer.indexOf("Opera")>=0){

  24return'Opera';

  25}

  26//Safari

  27elseif(explorer.indexOf("Safari")>=0){

  28return'Safari';

  29}

  30}

  31functionmethod(tableid){

  32if(getExplorer()=='ie')

  33{

  34varcurTbl=document.getElementById(tableid);

  35varoXL=newActiveXObject("Excel.Application");

  36varoWB=oXL.Workbooks.Add();

  37varxlsheet=oWB.Worksheets(1);

  38varsel=document.body.createTextRange();

  39sel.moveToElementText(curTbl);

  40sel.select();

  41sel.execCommand("Copy");

  42xlsheet.Paste();

  43oXL.Visible=true;

  44

  45try{

  46varfname=oXL.Application.GetSaveAsFilename("Excel.xls","ExcelSpreadsheets(*.xls),*.xls");

  47}catch(e){

  48print("Nestedcatchcaught"+e);

  49}finally{

  50oWB.SaveAs(fname);

  51oWB.Close(savechanges=false);

  52oXL.Quit();

  53oXL=null;

  54Tmr=window.setInterval("Cleanup();",1);

  55}

  56}

  57else

  58{

  59tableToExcel(tableid)

  60}

  61}

  62functionCleanup(){

  63window.clearInterval(Tmr);

  64CollectGarbage();

  65}

  66vartableToExcel=(function(){

  67varuri='data:application/vnd.ms-excel;base64,',

  68template='<html><head><metacharset="UTF-8"></head><body><table>{table}</table></body></html>',

  69base64=function(s){returnwindow.btoa(unescape(encodeURIComponent(s)))},

  70format=function(s,c){

  71returns.replace(/{(\w+)}/g,

  72function(m,p){returnc[p];})}

  73returnfunction(table,name){

  74if(!table.nodeType)table=document.getElementById(table)

  75varctx={worksheet:name||'Worksheet',table:table.innerHTML}

  76window.location.href=uri+base64(format(template,ctx))

  77}

  78})()

  79</script>

  80</head>

  81<body>

  82

  83<div>

  84<buttontype="button"onclick="method('tableExcel')">导出Excel</button>

  85</div>

  86

  87

  88<divid="myDi">

  89<tableid="tableExcel"width="100%"border="2"cellspacing="0"cellpadding="0">

  90

  91<tr>

  92<tdcolspan="5"align="center">金庸笔下人物</td>

  93</tr>

  94

  95<tr>

  96<td>倚天屠龙记</td>

  97<td>天龙八部</td>

  98<td>鹿鼎记</td>

  99<td>神雕侠侣</td>

  100<td>射雕英雄传</td>

  101</tr>

  102

  103<tr>

  104<td>张无忌</td>

  105<td>乔峰</td>

  106<td>韦小宝</td>

  107<td>杨过</td>

  108<td>郭靖</td>

  109</tr>

  110

  111<tr>

  112<td>赵敏</td>

  113<td>虚竹</td>

  114<td>康熙</td>

  115<td>小龙女</td>

  116<td>黄蓉</td>

  117</tr>

  118

  119<tr>

  120<td>周芷若</td>

  121<td>段誉</td>

  122<td>鳌拜</td>

  123<td>李莫愁</td>

  124<td>杨康</td>

  125</tr>

  126

  127</table>

  128</div>

  129</body>

  130</html>

  输出后显示:






如果您觉得本文的内容对您的学习有所帮助:支付鼓励



关键字:html
友荐云推荐