qianck

博客园 首页 新随笔 联系 订阅 管理

这个使用js 导出excel,可以集成其他语言,可以html,php,asp ,java 等,自己喜欢用那种语言就用哪种,使用非常方便。js是使用tableExport.js ,jquery-3.2.1.min.js 以及FileSaver.min.js

这个tableExport.js js插件很强大,有兴趣的可以搜索一下,这里分享个html + js 的导出excel表格。

 

 

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4   <meta charset="UTF-8">
 5   <title>HTML table Export</title>
 6 <script type="text/javascript" src="js/jquery-3.2.1.min.js" ></script>
 7 <script type="text/javascript" src="js/FileSaver.min.js" ></script>
 8 <script type="text/javascript" src="js/tableExport.js" ></script>
 9   <script type="text/javascript">
10     $(document).ready(function() {
11       var Table = document.getElementById ( 'container' );
12       var T = [];
13       var r = 0;
14       var c = 1;
15       var rmax = 5;
16       var cmax = 26;
17 
18       T.push('<table id="grid">');
19       T.push('<thead>');
20       T.push('<tr>');
21 
22       T.push('<th>col #</th>');
23       while (++c <= cmax+1)
24         T.push('<td>col ' + c + '</td>');
25 
26       T.push('</tr>');
27       T.push('</thead>');
28       T.push('<tbody>');
29 
30       while (r++ < rmax) {
31         c = 0;
32 
33         T.push('<tr>');
34         T.push('<td>' + r + '</td>');
35         while (c++ < cmax)
36           T.push('<td>' + getRandomInt(100,10000) + '</td>');
37         T.push('</tr>');
38       }
39 
40       T.push('</tbody>');
41       T.push('</table>');
42 
43       Table.innerHTML = T.join ("");
44 
45       $('#export').click(function() {
46         $('#grid').tableExport({
47           type:'excel',
48           fileName:"测试"
49            
50         });
51         // $('#grid').tableExport({type:'xlsx'});
52       });
53     });
54 
55     function getRandomInt(min, max) {
56         return Math.floor(Math.random() * (max - min + 1)) + min;
57     }
58 </script>
59 
60 </head>
61   <body>
62     <button id="export">导出 Excel</button>
63     <div id="container">
64     </div>
65   </body>
66 </html>

效果如下图:

 

这里是整个js+html 源代码,喜欢的拿去下载使用。点击这里下载:js导出excel表格 (访问密码:7509)

如果有不懂得,欢迎交流联系,谢谢。

posted on 2021-08-12 11:33  qianck  阅读(649)  评论(0编辑  收藏  举报

有什么问题,也可以找我,随时交流,QQ:1511923161

免费pdf电子书下载