将div保存为PDF时未定义jsPDF

问题描述

我正在尝试使用jsPDF保存具有特定ID的div元素,但得到Uncaught ReferenceError: jsPDF is not defined。尝试了多种解决此问题的方法包括所有关于stackoverflow的可用解决方案,但没有一个起作用。

这是div元素的外观(这是一个根据用户选择自动填充的表,在此示例中,我删除了大多数选项以减少行数)。以下是一个简短的片段,可以让您了解正在发生的事情。仍然说未定义jsPDF:

$('#savePDF').click(function() {
  var pdf = new jsPDF('p','pt','letter');
        source = $('#yourSummary');
        specialElementHandlers = {
            '#bypassme': function (element,renderer) {
                return true
            }
        };
        margins = {
            top: 80,bottom: 60,left: 40,width: 522
        };
        pdf.fromHTML(
            source,margins.left,margins.top,{
                'width': margins.width,'elementHandlers': specialElementHandlers
            },function (dispose) {
                pdf.save('your-summary.pdf');
            },margins
        );
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>
<div id="yourSummary" class="modal-body">
  <table id="yourExterior" class="table table-hover">
  <h5>Exterior</h5>
    <tbody>
     <tr>
      <th scope="row">Body colour</th>
      <td id="sumBC"></td>
     </tr>
    </tbody>
  </table>
</div>
<button class="btn-primary" id="savePDF">Save configuration as PDF</button>

但是,一旦我在浏览器中按下按钮,就会出现以下错误

Uncaught ReferenceError: jsPDF is not defined
at HTMLButtonElement.<anonymous> (main.js:34)
at HTMLButtonElement.dispatch (jquery-3.5.1.slim.min.js:2)
at HTMLButtonElement.v.handle (jquery-3.5.1.slim.min.js:2)

我做错了什么以及如何解决此问题?

解决方法

使用以前的版本
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>

2.0.0版本非常不同。
例如,将使用jspdf.jsPDF代替方法“ jsPDF”,但是会看到新的错误。