HTML到PDF(通过javascript)我如何添加CSS或表?

HTML到PDF(通过javascript)我如何添加CSS或表?,第1张

概述在一个项目中,我将html文件转换为pdf,而不是工作正常.但是这个输出没有显示css design.Now我需要一个建议如何用这个pdf文件添加css设计? 这里是js函数代码: $(function(){ var doc = new jsPDF(); var specialElementHandlers = { '#editor': function 在一个项目中,我将HTML文件转换为pdf,而不是工作正常.但是这个输出没有显示CSS design.Now我需要一个建议如何用这个pdf文件添加CSS设计?

这里是Js函数代码:

$(function(){         var doc = new Jspdf();    var specialElementHandlers = {        '#editor': function (element,renderer) {            return true;        }    };    $('#cmd').click(function () {        doc.fromHTML($('#StudentInfoListtable').HTML(),15,{            'wIDth': 170,'elementHandlers': specialElementHandlers        });        doc.save('sample-file.pdf');    });

我从这个项目中获得了帮助
https://github.com/MrRio/jsPDF

这是我的表

这是pdf输出

我试图添加一个表

$('#cmd').click(function () {        var table = tableToJson($('#StudentInfoListtable').get(0))        var doc = new Jspdf('p',pt,'a1',true);        doc.cellinitialize();        $.each(table,function (i,row){            console.deBUG(row);            $.each(row,function (j,cell){                doc.cell(10,50,120,cell,i);  // 2nd parameter=top margin,1st=left margin 3rd=row cell wIDth 4th=Row height            })        })        doc.save('sample-file.pdf');    });

这是功能

function tableToJson(table) {    var data = [];    // first row needs to be headers    var headers = [];    for (var i=0; i<table.rows[0].cells.length; i++) {        headers[i] = table.rows[0].cells[i].INNERHTML.tolowerCase().replace(/ /gi,'');    }    // go through cells    for (var i=0; i<table.rows.length; i++) {        var tableRow = table.rows[i];        var rowData = {};        for (var j=0; j<tableRow.cells.length; j++) {            rowData[ headers[j] ] = tableRow.cells[j].INNERHTML;        }        data.push(rowData);    }           return data;}

看到这个输出后我哭了!

有什么方法可以避免这种重叠?
在pdf中添加CSS的最佳解决方案是什么?

解决方法 好好经过多次尝试我已经解决了.特别感谢mihaIDp,这里的代码我解决了表行问题
$('#cmd').click(function () {        var table = tableToJson($('#StudentInfoListtable').get(0))        var doc = new Jspdf('p','pt','a4',row){                doc.setFontSize(10);                $.each(row,cell){                if(j=='name')                {                    doc.cell(10,100,30,i);                }                else if(j=='email')                {                    doc.cell(10,130,i);                }                else if(j=='track')                {                    doc.cell(10,40,i);                }                else if(j=='s.s.croll')                {                    doc.cell(10,51,i);                }                else if(j=='h.s.croll')                {                    doc.cell(10,i);                }                else                 {                    doc.cell(10,70,i);                  }            })        })

解决了这里的输出

总结

以上是内存溢出为你收集整理的HTML到PDF(通过javascript)我如何添加CSS或表?全部内容,希望文章能够帮你解决HTML到PDF(通过javascript)我如何添加CSS或表?所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1127090.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-30
下一篇 2022-05-30

发表评论

登录后才能评论

评论列表(0条)

保存