Question

我正在制定一项要求，我需要在点击按钮时将HTML文件导出为PDF。我的html文件有多个分区，我必须在将它们转换为canvas-image后将选定的分区导出为PDF。我对JsPDF和Html2canvas库有点新鲜，下面的代码适用于单一部门。请建议对此进行更改，以便将多个div导出为PDF。

<button id="btn">Generate PDF</button>
 <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.rawgit.com/MrRio/jsPDF/master/dist/jspdf.min.js"></script> 
<script type="text/javascript" src="//cdn.rawgit.com/niklasvh/html2canvas/0.5.0-alpha2/dist/html2canvas.min.js"></script>
 <script type="text/javascript" >
 (function(){
     var 
      form = $('.test'),
      cache_width = form.width(),
      a4  =[ 595.28,  841.89];  // for a4 size paper width and height

     $('#create_pdf').on('click',function(){
      $('body').scrollTop(0);
      createPDF();
     });
     //create pdf
     function createPDF(){
      getCanvas().then(function(canvas){
       var 
       img = canvas.toDataURL("image/png"),
       doc = new jsPDF({
               unit:'px', 
               format:'a4'
             });     
             doc.addImage(img, 'JPEG', 20, 20);
             doc.save('techumber-html-to-pdf.pdf');
             form.width(cache_width);
      });
     }

     // create canvas object
     function getCanvas(){
      form.width((a4[0]*1.33333) -80).css('max-width','none');
      return html2canvas(form,{
          imageTimeout:2000,
          removeContainer:true
         }); 
     }

     }());
 </script>
</body>
</html>

＆＃34;测试＆＃34;是我表单中一个div的类名，但我无法将以下代码用于多个div

使用JSPDF将{html文件中的多个分区导出为PDF

0 个答案: