32

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, 15, {
                    'width': 170,'elementHandlers': specialElementHandlers
                });
                doc.save('sample-file.pdf');
            });  
        }); 
    }
</script>
`
4

4 に答える 4

21

jsPDF-AutoTableプラグインを使用することもできます。次のコードを使用するデモをここで確認できます。

var doc = new jsPDF();
doc.autoTable("#basic-table");
doc.save("table.pdf");
于 2015-08-26T11:17:54.427 に答える
2

get(0)の代わりに使用しhtml()ます。つまり、置き換えます

doc.fromHTML($('#htmlTableId').html(), 15, 15, {
    'width': 170,'elementHandlers': specialElementHandlers
});

doc.fromHTML($('#htmlTableId').get(0), 15, 15, {
    'width': 170,'elementHandlers': specialElementHandlers
});
于 2016-03-30T10:19:42.860 に答える
1

PDFに変換する必要があるセクションを分離できます

たとえば、テーブルがクラス " pdf-table-wrap "にある場合

この後、 jsPDFと組み合わせてhtml2canvas関数を呼び出す必要があります。

以下はサンプルコードです

var pdf = new jsPDF('p', 'pt', [580, 630]);
html2canvas($(".pdf-table-wrap")[0], {
    onrendered: function(canvas) {
        document.body.appendChild(canvas);
        var ctx = canvas.getContext('2d');
        var imgData = canvas.toDataURL("image/png", 1.0);
        var width = canvas.width;
        var height = canvas.clientHeight;
        pdf.addImage(imgData, 'PNG', 20, 20, (width - 10), (height));

    }
});
setTimeout(function() {
    //jsPDF code to save file
    pdf.save('sample.pdf');
}, 0);

完全なチュートリアルはここにありますhttp://freakyjolly.com/create-multipage-html-pdf-jspdf-html2canvas/

于 2017-03-16T12:35:23.840 に答える