HTML Tabel呈现为PDF。 Pdf中的内容不是表格格式 [英] HTML Tabel rendering to PDF. Content in Pdf not tabel format

查看:91
本文介绍了HTML Tabel呈现为PDF。 Pdf中的内容不是表格格式的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这里我尝试使用一个HTML页面表格内容制作PDF。对我而言,它在创建PDF和下载方面工作得很好,但问题是我没有得到我在HTML页面中使用的正确表格格式(它在网页中看起来像我在PDF中所需要的那样)。下面给出我的代码和表结构。我正在使用 HTML表格导出jQuery插件

Here i am trying to make a PDF using one HTML page table content. for me its working fine in creating PDF and downloading, but the issue is am not getting correct table format which i used in HTML page (how it looks in web page like that i need in PDF too ). below am giving my code and table structure. i am using HTML table export jQuery plugin

我的HTML代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="bootstrap.min.css">
    <!-- jQuery 2.0.2 -->
    <script type="application/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
    <script type="application/javascript" src="tableExport.js"></script>
    <script type="application/javascript" src="jquery.base64.js"></script>
    <script type="application/javascript" src="jspdf/libs/sprintf.js"></script>
    <script type="application/javascript" src="jspdf/jspdf.js"></script>
    <script type="application/javascript" src="jspdf/libs/base64.js"></script>
</head>

<body>
    <div id="example">
        <table class="table table-bordered col-lg-6">
            <tr>
                <th class="text-center" colspan="5">Details</th>
            </tr>
            <tr>
                <th class="text-center">Time</th>
                <th class="text-center">Track</th>
                <th class="text-center">user</th>
                <th class="text-center">linked user's</th>
                <th class="text-center">User section</th>
            </tr>
            <tr>
                <td class="text-center">08:30 - 09:30</td>
                <td class="text-center" colspan="4">nill</td>
            </tr>
            <tr>
                <td class="text-center">09:30 - 12:00</td>
                <td class="text-center Inaugural" colspan="4">Inoo
                    <br> smartphones a big hit in world</td>
            </tr>
            <tr>
                <td class="text-center">09:30 - 12:00</td>
                <td class="text-center Industry" colspan="4">user Key
                    <br>smartphones a big hit in world</td>
            </tr>
            <tr>
                <td class="text-center">12:00 - 13:30</td>
                <td class="text-center Industry" colspan="4">User</td>
            </tr>
            <tr>
                <td class="text-center" rowspan="3">13:30 - 14:30</td>
                <td class="text-center">T Track</td>
                <td class="text-center">T User</td>
                <td class="text-center">smartphones a big hit in world</td>
                <td class="text-center">smartphones a big hit in world smartphones a big hit in world</td>
            </tr>
            <tr>
                <td class="text-center">T track</td>
                <td class="text-center">T user</td>
                <td class="text-center">smartphones a big hit in world</td>
                <td class="text-center">smartphones a big hit in worldsmartphones a big hit in world</td>
            </tr>
            <tr>
                <td class="text-center">T track</td>
                <td class="text-center">T user</td>
                <td class="text-center">smartphones a big hit in world</td>
                <td class="text-center">smartphones a big hit in worldsmartphones a big hit in worldsmartphones a big hit in world</td>
            </tr>
        </table>
    </div>
    <a href="#" onclick="$('#example').tableExport({type:'pdf',escape:'false'});">Genrate</a>
</body>

</html>


推荐答案

我知道我游戏有点晚了。但我发布这个以防任何人最终在这里寻找答案。

I know I'm a bit late to the game. But I'm posting this in case any one end up here looking for an answer.

我们可以使用jsPDF auto-Table插件为你的pdf添加格式良好的表格。要使用它,请下载并包含 jspdf.plugin .autotable.js jspdf.min.js

We can use jsPDF auto-Table plugin for adding a well formatted table to your pdf. For using it, download and include jspdf.plugin.autotable.js and jspdf.min.js.

使用简单,表格格式多种多样。

It is simple to use and has a good variety of table formats.

你可以在此GitHub存储库中找到完整的文档。

You can find the complete documentation in this GitHub repository.

这篇关于HTML Tabel呈现为PDF。 Pdf中的内容不是表格格式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆