JavaScript生成表格PDF

最新推荐文章于 2024-03-01 11:38:31 发布
最新推荐文章于 2024-03-01 11:38:31 发布
阅读量533 收藏 1
点赞数
分类专栏： 前端 文章标签： html5 css js javascript html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43321726/article/details/109984309
版权 
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Make PDF</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
            font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
        }

        body {
            background-image: linear-gradient(to right, rgb(54, 53, 53), rgb(67, 67, 88), rgb(76, 98, 119));
            color: black;
            font-weight: 600;
        }

        .main {
            width: 960px;
            /* height:480px; */
            margin: 0px auto;
            margin-top: 20px;
            padding: 10px;
            text-align: center;
            background-image: linear-gradient(to bottom, white, rgb(219, 219, 221));
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 2px 2px 8px #fff;
        }

        .body {
            width: 95%;
            height: 480px;
            padding-top: 40px;

        }

        .tempTr1 td {
            text-align: center;
        }

        table tr td {
            padding: 5px;
        }



        .buttonBox {
            width: 960px;
            height: 480px;
            margin: 0px auto;
        }

        .buttonBox button {
            padding: 5px;
            background-color: #888888;
            color: #FFFFFF;
            border: none;
            border-radius: 5px;
            cursor: pointer;
        }

        .tbodys:hover {
            background-color: #e98d1d !important;
            cursor: pointer;
            font-size: 16px;
            border: 2px solid #ffe4c4;
            box-shadow: 2px 2px 10px #ffe4c4;
            font-weight: 900;
        }

        .time {
            margin-bottom: 10px;
        }

        .allInfoData {
            width: 940px;
            height: 70px;
            border: 1px solid black;
            border-top: none;
        }

        .allInfoData {
            text-align: left;
        }

        .left {
            width: 60px;
            height: 70px;
            border-right: 1px solid black;
            font-size: 20px;
            line-height: 70px;
            margin-left: 20px;
        }

        .right {
            position: relative;
            top: -57px;
            right: -105px;
            text-align: left;
        }
        .content>span{
            padding: 0 20px;
        } 
        .contentOne>span{
            padding: 0 20px;
        } 
    </style>
</head>

<body>
    <!-- 需要打印的pdf页面放在这里 -->
    <div class="main">
        <div style="font-weight:900;font-size
        :24px">广东金立变速科技股份有限公司出勤明细表</div>
        <div class="time">2020-05-01 至 2020-05-31</div>
        <table border="1"
            style="background-color: #ffe4c4; width: 100%; border-collapse: collapse;border-bottom: none;">
            <tbead>
                <tr>
                    <th>工号</th>
                    <th>0166</th>
                    <th>姓名</th>
                    <th>张请</th>
                    <th>部门</th>
                    <th>3FC</th>
                    <th>职务</th>
                    <th>员工</th>
                    <th>入职日期</th>
                    <th>2020-11-03</th>
                </tr>
                </thead>
        </table>
        <table border="1" style="width: 100%; border-collapse: collapse;background-color: #ffe4c4;">
            <thead>
                <tr>
                    <th>日期</th>
                    <th>星期</th>
                    <th>
                        <div
                            style="position: relative;left: 22px;border-bottom: 1px solid black;background-color:#ffe4c4;">
                            第一次</div>
                        上班
                    </th>
                    <th>
                        <div style="visibility: hidden;">d</div>
                        下班
                    </th>
                    <th>
                        <div
                            style="position: relative;left: 22px;border-bottom: 1px solid black;background-color: #ffe4c4;">
                            第二次</div>
                        上班
                    </th>
                    <th>
                        <div style="visibility: hidden;">d</div>
                        下班
                    </th>
                    <th>
                        <div
                            style="position: relative;left: 22px;border-bottom: 1px solid black;background-color: #ffe4c4;">
                            第三次</div>
                        上班
                    </th>
                    <th>
                        <div style="visibility: hidden;">d</div>
                        下班
                    </th>
                    <th>
                        <div
                            style="position: relative;left: 22px;border-bottom: 1px solid black;background-color: #ffe4c4;">
                            第四次</div>
                        上班
                    </th>
                    <th>
                        <div style="visibility: hidden;">d</div>
                        下班
                    </th>
                    <th>出勤</th>
                    <th>迟到</th>
                    <th>早退</th>
                    <th>旷工</th>
                    <th>请假</th>
                    <th>放假</th>
                    <th>
                        <div
                            style="position: relative;left: 45px;border-bottom: 1px solid black;background-color: #ffe4c4;">
                            加班时间</div>
                        平时
                    </th>
                    <th>
                        <div style="visibility: hidden;">d</div>
                        周末
                    </th>
                    <th>
                        <div style="visibility: hidden;">d</div>
                        法日
                    </th>
                    <th>工作</th>
                    <th>性质</th>
                    <th>班制</th>
            </thead>
            <tbody class="tbodys">
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
                <tr class="tbodys">
                    <td>2020.11.21</td>
                    <td>周五</td>
                    <td>9</td>
                    <td>10</td>
                    <td>23</td>
                    <td>3</td>
                    <td>2</td>
                    <td>23</td>
                    <td>2</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>23</td>
                    <td>为</td>
                    <td>1</td>
                    <td>7</td>
                    <td>9</td>
                    <td>7</td>
                    <td>6</td>
                    <td>公休日</td>
                </tr>
            </tbody>
        </table>
        <div class="allInfoData">
            <div class="left">合计
            </div>
            <div class="right">
                <div class="content"> <span>出勤天数20</span>
                    <span>工作小时180</span>
                    <span>平时加班0</span>
                    <span>周末加班0</span>
                    <span>法日加班0</span>
                    <span>总加班0</span></div>
               
            </div>
        </div>
    </div>
    <div class="buttonBox">
        <button onclick="pdfDo()">导出PDF</button>
        <div style="color: red;font-weight: 500;font-size: 12px;">温馨提示：当数据错乱或导出文件失败时请切换浏览器！</div>
    </div>
</body>
<script src="https://cdn.bootcss.com/html2canvas/0.5.0-beta4/html2canvas.js"></script>
<script src="https://cdn.bootcss.com/jspdf/1.3.4/jspdf.debug.js"></script>
<script>
    // 导出pdf
    function pdfDo() {
        var isDo = confirm("确定导出pdf页面");
        if (!isDo) { return; }
        var target = document.getElementsByClassName("main")[0];
        target.style.backgroundImage = "#FFFFFF";

        html2canvas(target, {
            onrendered: function (canvas) {
                var contentWidth = canvas.width;
                var contentHeight = canvas.height;
                //一页pdf显示html页面生成的canvas高度;
                var pageHeight = contentWidth / 592.28 * 841.89;
                //未生成pdf的html页面高度
                var leftHeight = contentHeight;
                //页面偏移
                var position = 0;
                //a4纸的尺寸[595.28,841.89]，html页面生成的canvas在pdf中图片的宽高
                var imgWidth = 595.28;
                var imgHeight = 592.28 / contentWidth * contentHeight;

                var pageData = canvas.toDataURL('image/jpeg', 1.0);

                var pdf = new jsPDF('', 'pt', 'a4');

                //有两个高度需要区分，一个是html页面的实际高度，和生成pdf的页面高度(841.89)
                //当内容未超过pdf一页显示的范围，无需分页
                if (leftHeight < pageHeight) {
                    pdf.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight);
                } else {
                    while (leftHeight > 0) {
                        pdf.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
                        leftHeight -= pageHeight;
                        position -= 841.89;
                        //避免添加空白页
                        if (leftHeight > 0) {
                            pdf.addPage();
                        }
                    }
                }
                pdf.save("pdf_file_name.pdf");
            }
        })
    }
    // 隔行变色
    function selectColor() {
        var tbodys = document.getElementsByClassName('tbodys')
        for (var i = 0; i < tbodys.length; i++) {
            var j = i + 1;
            if (j % 2 === 0) {
                tbodys[i].style.backgroundColor = '#e2dad0';
            } else {
                tbodys[i].style.background = '#ffff'
            }
        }
    };
    selectColor()
</script>

</html>

在这里插入图片描述

pandaHe_Status
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
使用jspdf生成pdf报表
12-08
由于前台html已经动态生成报表，而且，前台有一个功能，一个date range组件，当你拖动的时候，报表会在不提交到后台的情况下动态变化。 因此需要用到js生成生报表： 用到的组件： jquery.js jspdf.js canvg.js html2canvas.js jspdf.plugin.autotable.js 前台动态生成的chart现在一般是用的html5的canvas或者是svg,很不幸运，我遇到的是svg, 如果是flash没研究过。 由于报表还需要保持原html页面的外观，但是又不是整个html，真正需要转换成pdf报表的是：html+svg 前提：jsPDF 支持h
js生成pdf、Excel
04-24
js生成pdf、Excel，实现导出pdf无乱码文件，欢迎大家下载
用js生成PDF的方案
10-21 444
在java里，我们常用Itext来生成pdf，在pdf文件里组合图片，文字，画表格，画线等操作，还会遇到中文支持的问题。 那好，现在想直接在web前端就生成pdf怎么办，目前有以下几个解决方案 1：JSPDF.js 这个库支持不同类型的PDF文件格式，包括：文本，数字，图形，图片，同时你可以自由的编辑标题或者其它类型元素。 还支持互动的内容制作，例如，你可以输入文字或者数字，然后...
JavaScript生成PDF
weixin_43321726的博客
11-21 2840
废话不多说直接上代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Make PDF</title> <style> .main
jspdf：即时生成pdf的插件，支持表单图文混排
睦生
03-01 2670
jspdf是即时生成pdj的插件，支持通过html代码或源数据生成。
generate-pdf:使用jsPDF和ReactJS使用javascript生成PDF
05-03
本项目利用jsPDF库和ReactJS框架，结合JavaScript技术，实现了动态生成PDF的功能。接下来，我们将深入探讨这些知识点。 **jsPDF** 是一个开源的JavaScript库，它允许开发者在浏览器环境中生成PDF文件。jsPDF提供了...
JavaScript代码生成PDF文件的方法
10-22
JavaScript作为前端开发中最为常见的编程语言之一，在网页中直接生成PDF文件是一个非常实用的技能。本文将详细介绍使用JavaScript代码生成PDF文件的方法，并特别提到一个广泛使用的库——jsPDF。 jsPDF是一个完全用...
jsPDF-AutoTable：jsPDF插件，用于使用JavaScript生成PDF表
02-04
用Javascript生成PDF表 这个jsPDF插件增加了通过解析HTML表或直接使用Javascript数据生成PDF表的功能。 查看或。 安装 通过执行以下操作之一来获取jsPDF和此插件： npm install jspdf jspdf-autotable 从github...
jsPDF 是一个使用Javascript语言生成PDF的开源库.zip
09-17
**jsPDF：JavaScript生成PDF的开源库** jsPDF是一个强大的JavaScript库，专为在Web浏览器环境中生成PDF文档而设计。这个库允许开发者使用纯JavaScript代码创建高质量、可下载的PDF文件，无需依赖任何服务器端技术。...
PDF生成工具（Javascript）
12-24
以下我们将深入探讨JavaScript生成PDF的相关知识点。 首先，我们关注的核心库是`jspdf.js`，这是一个流行的JavaScript库，专门用于在浏览器环境中生成PDF。`jspdf`库提供了一系列方法，如`addPage`用于添加新页面，...
TIB_js-studiocomm_6.6.0_windows_x86_64.exe
08-03
TIB_js-studiocomm_6.6.0_windows_x86_64.exe 可以设计报表的界面或形式
TIB_js-jrs-cp_7.1.0_bin.zip
05-12
JasperReport是一个强大、灵活的报表生成工具，能够展示丰富的页面内容，并将之转换成PDF，HTML，或者XML格式。该库完全由Java写成，可以用于在各种Java应用程序，包括J2EE，Web应用程序中生成动态内容。 这是JasperReport服务器。
nodejs在pdf中绘制表格
ArmadaDK的博客
09-25 747
之前我已经了解过如何在pdf模板中填写字段了nodejs根据pdf模板填入中文数据并生成新的pdf文件但是当我具体使用的时候，我发现我的模板里面有表格，表格的长度是不固定的，所以需要动态生成一个表格，就要在原方案生成的pdf后面自己画上表格，可以在pdflib的官网上看到一些例子。
前端根据后端数据生成pdf表格 保姆级教学jspdf jspdf-autotable 以及中文乱码
欢迎来到我的博客
10-24 2793
前端根据后端数据生成pdf表格 保姆级教学jspdf jspdf-autotable 以及中文乱码
JS前端生成pdf文件和excel文件
Dilomen的博客
04-18 4391
生成pdf文件： 使用html2canvas和jspdf插件 详情： jspdf html2canvas 通过下面指令安装或者使用CDN npm install --save html2canvas jspdf 然后分别引入 import html2canvas from 'html2canvas' import JsPdf from 'jspdf' 先通过html2canvas将DOM元素整...
js导出工具（表格，图片，pdf）
xld的博客
04-28 799
html2canvas: http://html2canvas.hertzen.com/ 将html界面转换为canvas，然后导出图片 simple-html2pdf： https://www.npmjs.com/package/simple-html2pdf 将html生成pdf（自动分页，每页大小高约1050px，宽大约800px），之前尝试过使用html2canvas转成图片然后采用jsp...
使用 jsPDF- Autotable 将 HTML 表格导出为 PDF
allway2的博客
04-25 1197
介绍 您一定从 Internet 下载过PDF 文件。它可能是考试表格、费用收据、发票或任何此类文件。您有没有想过这些内容是如何一键以 PDF 的形式下载的？今天，我们将在本文中执行相同的操作。只会有一点点变化。在这里，我们将学习如何以 PDF 的形式导出表格。 在本文中，我们将了解 jsPDF - AutoTable 并使用 jsPDF - AutoTable 将简单的 HTML 表格导出为 PDF。 在开始使用它之前，让我们先了解什么是 jsPDF 和 jsPDF - Aut...
前端生成pdf的ｊｓ库－pdfmake．ｊｓ的简单使用
swirlee的博客
07-31 2204
　　公司之前是通过Jaspersoft Studio软件，生成一个．ｊａｓｐｅｒ文件模板，通过模板中的ｓｑｌ语句，查询信息，生成ｐｄｆ传给前端显示或者下载。 　　但是觉得会占用带宽，浪费服务器资源，并且这件事前端ｊｓ也可以实现，在网上找到了国外某神人开发的ｐｄｆｍａｋｅ．ｊｓ这个库，觉得很棒，英文比较棒的同学可以前往官网自学： 　　ｐｄｆｍａｋｅ．ｊｓ官网：http://pdfmake.or...
用PDFLib生成嵌套表结构并在嵌套表中加进度条
jeff_wdj的专栏
08-20 362
用PDFLib生成嵌套表结构并在嵌套表中加进度条
模板生成pdf, 根据数据生成动态表格
最新发布
08-01
模板生成PDF并插入动态表格通常涉及到两个关键步骤：设计模板和数据填充。首先，你需要准备一个PDF模板，这个模板可以是一个预先设计好的布局，包含固定的标题、边框、页眉和页脚等元素。在这个模板中，你可以选择将...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值