资讯专栏INFORMATION COLUMN

【js】——前端无插件导出excel:自定义sheet、插入图片、设置打印、页边距、页脚等

flybywind / 2590人阅读

摘要:思路用现有的导出的插件,无法实现,所以只能手写各种样式代码关于打印页脚之类无从下手的要求,需要导出后,复制一份,原文件拖进,查看源码,复制的那份用打开,设置打印页脚。

背景

前段时间因一个需求后端无法完成,所以交给前端来实现,导出表格,需要实现:
1、支持多个sheet,并且有自己的name
2、根据要求合并单元格,设置单元格的宽高
3、在表格内有各自的二维码
4、打印的页边距为左右各0.5cm
5、打印多页的话,固定表头
6、设置页脚

实现

导出后,如下图所示:

源码

https://github.com/pangpangni...
略凌乱,欢迎指正及优化。

思路

用现有的js导出excel的插件,无法实现,所以只能手写各种样式代码;
关于打印、页脚之类无从下手的要求,需要导出后,复制一份,原文件拖进sublime,查看源码,复制的那份用wps打开,设置打印、页脚。然后复制的那份拖进sublime,对比两个文件的代码有什么不同,就基本可以知道打印、页脚的代码。

Bug

1、只能用wps打开,如果用excel打开的话,会报错
2、wps打开后,如果修改了内容,保存后再打开,二维码消失

重点代码

1、设置页脚及页边距

    

2、文字折行

 
   送货人:
   

日 期 :

3、打印固定表头


   Print_Titles
   1
   =3D"2773"!$1:$7


   Print_Titles
   1
   =3D"2773"!$1:7

4、插入图片
目前只支持插入转成base64的图


------BOUNDARY_0008----
Content-Location: file:///C:/0E8D990C/SongHuoDan/code2773.xml
Content-Transfer-Encoding: base64
Content-Type: image/jpeg

iVBORw0KGgoA...省略掉...Qn9mxgAAAABJRU5ErkJggg==
------BOUNDARY_0008----
Content-Location: file:///C:/0E8D990C/SongHuoDan/code2774.xml
Content-Transfer-Encoding: base64
Content-Type: image/jpeg

其他的请自行摸索……

注意

1、请严格按照格式拼接代码(空格、空行等)
2、注意分割线boundary="----BOUNDARY_0008----",BOUNDARY_0008可以改成别的

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/93050.html

相关文章

  • JS实现打印的方式

    摘要:实现打印的方式方式一会弹出打印对话框,打印的是中的内容,下面是从网上摘到的一个局部打印的例子,该例子的不足是打印会修改页面的内容。 目前正在做浏览器端采用js方式实现打印这么一个功能,JS打印实现的方法很多,但是兼容各个浏览器实现打印预览的功能有些棘手,现将实现的内容及遇到的问题记录下来,希望有大牛看到所提的问题后可以给予解答,在此感谢啦。 1.JS实现打印的方式 方式一:window...

    LucasTwilight 评论0 收藏0
  • CSS 打印

    摘要:原文链接简介本文主要讲解如何使用控制打印样式。用户代理可以调整文档内容的格式,使其显示在可打印区域。不管是否双面打印,打印总是包含左页和右页分别通过指定。伪类和需要双面打印时,通常需要将左页和右页设置不同的样式如页边距页码位置。 原文链接:https://lon.im/post/css-print... 简介 showImg(https://segmentfault.com/img/r...

    weapon 评论0 收藏0
  • 前端实现Excel导入和导出功能

    摘要:介绍最近项目中让实现一个导入导出的功能,查找了一些插件后发现这个插件,所以就尝试使用了一下,这里将使用方法和遇到的问题简单记录一下。 介绍 最近项目中让实现一个导入导出Excel的功能,查找了一些插件后发现js-xlsx这个插件,所以就尝试使用了一下,这里将使用方法和遇到的问题简单记录一下。 SheetJS js-xlsx 是一款能够读写多种格式表格的插件,浏览器支持良好,并且能在多个...

    Amio 评论0 收藏0
  • 前端实现Excel导入和导出功能

    摘要:介绍最近项目中让实现一个导入导出的功能,查找了一些插件后发现这个插件,所以就尝试使用了一下,这里将使用方法和遇到的问题简单记录一下。 介绍 最近项目中让实现一个导入导出Excel的功能,查找了一些插件后发现js-xlsx这个插件,所以就尝试使用了一下,这里将使用方法和遇到的问题简单记录一下。 SheetJS js-xlsx 是一款能够读写多种格式表格的插件,浏览器支持良好,并且能在多个...

    only_do 评论0 收藏0
  • 使用 SpreadJS 实现 JavaScript 中导入和导出Excel文件

    摘要:而作为一款深受用户喜爱的电子表格工具,借助其直观的界面出色的计算性能和图表工具,已经成为数据统计领域不可或缺的软件之一。使用实现的导入和导出通过纯,您完全可以实现导入和导出文件功能,并为最终用户提供与这些文件进行交互的界面。 JavaScript是一个涵盖多种框架、直译式、可以轻松自定义客户端的脚本语言,在 Web 应用程序中,更加易于编码和维护。而Excel 作为一款深受用户喜爱的电...

    Jioby 评论0 收藏0

发表评论

0条评论

flybywind

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<