Question

我正在使用Jquery Bracket为运动应用生成支架。

https://www.npmjs.com/package/react-graph-vis

我使用以下代码生成括号

 var mData = {
    teams : [
      ["John Anderson", "Peter Robert"], /* first matchup */
      ["Maria Lucos", "Usha Elizabeth"]  /* second matchup */
    ],
    results : [
      [[1,2], [3,4]],       /* first round */
      [[4,6], [2,1]]        /* second round */
    ]
  }


    $(function() {
        $('.demo').bracket({
          init: mData /* data to initialize the bracket with */ })
      })

现在我们在html中有一个带有类demo的div。在此我们将附加n个包围数据。我们想将这个html数据转换为pdf。为此，我们在jspdf中使用了以下代码，

print_brackets(){
     var pdf = new jsPDF('p', 'pt', 'letter', true);
         pdf.internal.scaleFactor =3.5;
  recursivePDF(0,1,splitTitle);
function recursivePDF(i,n,splitTitle) {

var checkholdin =0;
    if(i == 0){
        var k =100
        var l=80
    }
    else{
        var k = 60
        var l=60
    }
          pdf.addHTML($('#wholebracket'+i+'>#scoresheet'+n+'>div.brackdata>div.jQBracket.lr>div.bracket' ).get(0), 30, l+40, options, function() {

     exportIndex = parseInt(exportIndex) + 1;
     scoreIndex = parseInt(scoreIndex) + 1;
    var scoreLength = $('#wholebracket'+i+'>div.scoresheet').length;
    var holdLength = $('#wholebracket'+i+'>div.holding').length;
      if(exportIndex == exportLength) {
       pdf.setFontSize(10);
       pdf.setTextColor(39, 39, 206);
       pdf.setFontType("bold");
      pdf.text(splitTitle, 300, l-40,'center');
      pdf.setFontType("normal");
     pdf.setFontSize(18);
      pdf.setTextColor(39, 39, 206);
      pdf.text(300, l, "Scoresheet", 'center');                                                pdf.setFontSize(10);pdf.setFontType("normal");
    pdf.setTextColor(0, 0, 0);
     pdf.text(30, l+20,"Division: ");
    pdf.setFontType("bold");
     pdf.text(80, l+20,cname);
     pdf.setTextColor(150);                                                pdf.setFontType("normal");
    pdf.text(520, l+20,day);
    pdf.output('save', 'Bracketed_Scoresheet.pdf');                                             
    $('.demo').hide();                                                $('.score_table').hide();$(".demo").empty();
    $(".score_table").empty();document.getElementById('tournament').value='';
     return true;
     }     
    else {
     pdf.setFontSize(10);
     pdf.setTextColor(39, 39, 206);
      pdf.setFontType("bold");                                                pdf.text(splitTitle, 300, l-40,'center');                  
     pdf.setFontType("normal");
     pdf.setFontSize(18);
     pdf.setTextColor(39, 39, 206);
     pdf.text(300, l, "Scoresheet", 'center');
     pdf.setFontSize(10);
     pdf.setTextColor(0, 0, 0);
      pdf.text(30, l+20,"Division: ");
     pdf.setFontType("bold");
     pdf.text(80, l+20,cname);                                                pdf.setFontType("normal");
    pdf.setTextColor(150);
     pdf.text(520, l+20,day);
     pdf.addPage(); 
    if(scoreLength == n){

     n = 1; 
       i=i+1;
     } 
     else{
    n=n+1;i=i+0;
     }
     var k=0;                                                    recursivePDF(i,n,splitTitle);
     }
       return true;
     });
}

在.demo div中我们在div＃wholebracket中有n个括号，它是根据括号长度递增的。我们有recursivepdf函数，它循环遍及获取所有括号数据，最后如果循环到达，我们已经下载了pdf使用pdf.save函数。

在Safari中，此代码运行正常。但在Chrome和IE中，PDF已下载但只获得空白页面。

我们还尝试使用HTML而不是addHTML。但是因为没有应用jquery包围css。只获得名单。

如果有人对此有所了解，那会很有帮助。

谢谢，
JeniDev。

使用Angular2在JSPDF中打印Jquery括号

0 个答案: