使用jsPDF將HTML內容轉換為PDF文件

Question

嘗試自動將此內容轉換為pdf文件。 根據其余代碼的設置方式，我必須具有單擊要導出到pdf的div內的按鈕。 這有問題嗎？ 到目前為止，這就是我所擁有的。 當我單擊按鈕時，它什么也沒做。

JS：

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.debug.js"></script>

<script>
jQuery('#generatereport').click(function () {
    doc.fromHTML(jQuery('#lppresults').html(), 15, 15, {
        'width': 170
    });
    doc.save('sample-file.pdf');
});
</script>

HTML：

<div class="survey-results" style="display: none;" id="lppresults">
   <button id="generatereport">Download Report</button>
   TEST CONTENT
</div>

Answer 1

不，這不是問題。 您可以將按鈕放在div元素內。 雖然您還有其他問題。 這是您的代碼的修訂版...

 var doc = new jsPDF(); $('#generatereport').click(function() { doc.fromHTML($('#lppresults')[0], 15, 15, { width: 170 }, function() { doc.save('sample-file.pdf'); }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"></script> <div class="survey-results" id="lppresults"> <button id="generatereport">Download Report</button> TEST CONTENT </div> 

Answer 2

您需要初始化jsPDF類： var doc = new jsPDF();

 var doc = new jsPDF(); jQuery('#generatereport').click(function() { doc.fromHTML(jQuery('#lppresults').html(), 15, 15, { 'width': 170 }); doc.save('sample-file.pdf'); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"></script> <div class="survey-results" id="lppresults"> <button id="generatereport">Download Report</button> TEST CONTENT </div>