【问题标题】:why is the jspdf code below printing the data on next page?为什么下面的jspdf代码在下一页打印数据?
【发布时间】:2016-09-06 14:17:57
【问题描述】:

下面的代码是 java 脚本的 sn-p,它使用 jspdf 生成 html 文件的 pdf。我正在使用 HTML 渲染器,它从 id 为 #formcare 的.jsp 文件获取内容。

function formpdf(){
         var doc = new jsPDF();
         var imgData = 'data:image/png;base64,iVBORwuy9B5xcZ3kvrHCTmy'; //image url
              doc.addImage(imgData, 'PNG', 90, 05, 25,25);
        doc.setFont("times");
        doc.setFontType("normal");
        doc.setFontSize("14");
        doc.text(90,35, 'IDeaS INDIA');
        doc.text(50,40,'Reimbursement Form For Employee Day Care');

        doc.setFontSize("12");
        doc.text(70,55,document.getElementById("date").value);
        doc.text(70,60,document.getElementById("name").value);
        doc.text(70,65,document.getElementById("department").value);
        doc.text(70,70,document.getElementById("designation").value);
        doc.text(70,75,document.getElementById("daycare").value);
        doc.text(70,80,document.getElementById("childName").value);
        doc.text(70,85,document.getElementById("dob").value);
        doc.text(70,90,document.getElementById("age").value);           

        var specialElementHandlers = {
              '#editor': function(element, renderer){
                  return true;
              }
        };

        //formcare is my tableId in .jsp file
         doc.fromHTML($('#formcare').get(0), 15, 50, {
              'width': 170, 
              'elementHandlers': specialElementHandlers
        });

         doc.text(10,190,'Note-Employees to ensure that the DAY CARE Center is registered under shop act establishment.');
        doc.text(10,200,'Employees will be responsible towards the safety of the child and company holds no obligation.'); 
        doc.save('form.pdf');           
    }

【问题讨论】:

    标签: javascript jspdf


    【解决方案1】:

    根据https://parall.ax/products/jspdf,HTML 渲染仍处于早期阶段。 它不支持css和样式。

    因此,如果您希望在单页中显示文档,请检查您正在呈现的 html/div。尝试减少 html/div 中的 <br> 或其他换行标记

    【讨论】:

      【解决方案2】:

      如果您使用引导程序进行样式设置,这个问题将得到解决!

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2011-05-28
        • 1970-01-01
        • 2021-10-19
        • 2020-10-27
        • 1970-01-01
        • 2012-01-18
        • 2021-09-07
        相关资源
        最近更新 更多