使用jspdf导出HTML表格到pdf

我需要使用jspdf导出HTML表格到pdf文件。我尝试了以下代码，但它显示在pdf文件中的空白/空输出。任何建议或示例代码将是有帮助的。
`

<script type="text/javascript">
    function demo1() {
        $(function () {
            var specialElementHandlers = {
                '#editor': function (element,renderer) {
                    return true;
                }
            };
         $('#cmd').click(function () {
                var doc = new jsPDF();
                doc.fromHTML($('#htmlTableId').html(),15,{
                    'width': 170,'elementHandlers': specialElementHandlers
                });
                doc.save('sample-file.pdf');
            });  
        }); 
    }
</script>
`

解决方法

这里是工作示例：

在头上

<script type="text/javascript" src="jspdf.debug.js"></script>

脚本：

<script type="text/javascript">
        function demoFromHTML() {
            var pdf = new jsPDF('p','pt','letter');
            // source can be HTML-formatted string,or a reference
            // to an actual DOM element from which the text will be scraped.
            source = $('#customers')[0];
 
            // we support special element handlers. Register them with jQuery-style 
            // ID selector for either ID or node name. ("#iAmID","div","span" etc.)
            // There is no support for any other type of selectors 
            // (class,of compound) at this time.
            specialElementHandlers = {
                // element with id of "bypass" - jQuery style selector
                '#bypassme': function(element,renderer) {
                    // true = "handled elsewhere,bypass text extraction"
                    return true
                }
            };
            margins = {
                top: 80,bottom: 60,left: 40,width: 522
            };
            // all coords and widths are in jsPDF instance's declared units
            // 'inches' in this case
            pdf.fromHTML(
                    source,// HTML string or DOM elem ref.
                    margins.left,// x coord
                    margins.top,{// y coord
                        'width': margins.width,// max width of content on PDF
                        'elementHandlers': specialElementHandlers
                    },function(dispose) {
                // dispose: object with X,Y of the last line add to the PDF 
                //          this allow the insertion of new lines after html
                pdf.save('Test.pdf');
            },margins);
        }
    </script>

和表：

<div id="customers">
        <table id="tab_customers" class="table table-striped" >
            <colgroup>
                <col width="20%">
                <col width="20%">
                <col width="20%">
                <col width="20%">
            </colgroup>
            <thead>         
                <tr class='warning'>
                    <th>Country</th>
                    <th>Population</th>
                    <th>Date</th>
                    <th>Age</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Chinna</td>
                    <td>1,363,480,000</td>
                    <td>March 24,2014</td>
                    <td>19.1</td>
                </tr>
                <tr>
                    <td>India</td>
                    <td>1,241,900,2014</td>
                    <td>17.4</td>
                </tr>
                <tr>
                    <td>United States</td>
                    <td>317,746,2014</td>
                    <td>4.44</td>
                </tr>
                <tr>
                    <td>Indonesia</td>
                    <td>249,866,000</td>
                    <td>July 1,2013</td>
                    <td>3.49</td>
                </tr>
                <tr>
                    <td>Brazil</td>
                    <td>201,032,714</td>
                    <td>July 1,2013</td>
                    <td>2.81</td>
                </tr>
            </tbody>
        </table> 
    </div>

并按钮运行：

<button onclick="javascript:demoFromHTML()">PDF</button>

和在线工作示例：

tabel to pdf jspdf

或尝试这样：HTML Table Export

使用jspdf导出HTML表格到pdf

解决方法

猜你在找的HTML相关文章