使用jsPDF将我网站中的Div导出为PDF格式的报告,但无法获得正确的格式

时间:2017-07-05 10:27:09

标签: javascript html jspdf

正如标题所说,我正在使用jsPDF导出我网站中的div部分以导出为PDF文档。

这些是我的代码

<script>
function exportToPDF() {
    var pdf = new jsPDF('l', 'pt', 'a4');
    // source can be HTML-formatted string, or a reference
    // to an actual DOM element from which the text will be scraped.
    source = $('#tab_cm')[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: 30,
        bottom: 60,
        left: 30,
        width: 500
    };
    // 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(pdfName);
        }, margins
    );
}
</script>

我的Div部分如下所示: https://drive.google.com/file/d/0B2mHDe7wmRSfU2Q0UjM4QV9Sc2c/view?usp=sharing

但它看起来像导出后的 https://drive.google.com/file/d/0B2mHDe7wmRSfMndIVGZUQ2FHLW8/view?usp=sharing

如您所见,我不知道如何在导出的PDF表格中正确对齐这些文本。

提前感谢您的帮助!

1 个答案:

答案 0 :(得分:0)

jspdf不支持css,因此很难获得正确的格式。您可以制作html的图像,然后将其添加到pdf中。请参阅此答案:https://stackoverflow.com/a/43064789/7751910