jsPDF 未在 javascript 中定义答案

【问题标题】：jsPDF is not defined in javascriptjsPDF 未在 javascript 中定义
【发布时间】：2020-09-08 02:50:21
【问题描述】：

我导入了 jsPDF 库并尝试导出为 PDF，但我收到 JavaScript 错误 jsPDF 未定义。

我尝试了其他类似的帖子，但它对我不起作用。

我在这里得到了小提琴https://jsfiddle.net/aybhvf8e/1/

<script type="text/javascript" src="https://unpkg.com/jspdf@latest/dist/jspdf.umd.min.js"></script>

$( document ).ready(function() {

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

$('#cmd').click(function () {
    doc.fromHTML($('#content').html(), 15, 15, {
        'width': 170,
            'elementHandlers': specialElementHandlers
    });
    doc.save('sample-file.pdf');
});


<div id="content">
     <h3>Hello, this is a H3 tag</h3>

    <p>A paragraph</p>
</div>
<div id="editor"></div>
<button id="cmd">generate PDF</button>

【问题讨论】：

标签： javascript jspdf

【解决方案1】：

我认为您的代码似乎正确，但 cdn 存在一些问题。我在这里使用了调试一个。

这是我创建的一个工作示例，您可以参考。如果由于 stackoverflow 限制看不到 pdf 下载，请使用此 fiddle 进行测试。

Working Download PDF demo

我使用的cdn链接是：JsPDF CDN LINK。您绝对可以寻找任何其他可用的版本。

function createPdf() {

  var doc = new jsPDF();
  
  source = $('#content')[0];
  
  specialElementHandlers = {
        '#editor': function (element, renderer) {
            return true
        }
    };
  
  doc.fromHTML(
    source,
    15,
    15, 
    {
      'width': 170,
      'elementHandlers': specialElementHandlers
    }
  );
  doc.save('sample-file.pdf')
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.2.61/jspdf.debug.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div id="content">
     <h3>Hello, this is a H3 tag</h3>

    <p>A paragraph</p>
</div>
<div id="editor"></div>
<button onclick="javascript:createPdf()" id="cmd">generate PDF</button>

【讨论】：

【解决方案2】：

我发现了两个主要问题，在这个fork 中解决了。首先，您没有链接到jspdf。您可以在 html 代码中执行此操作：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>

其次，在ready() 函数之外添加click 事件监听器。这又会导致两个问题：事件可能未附加（确保检查ready() 函数的原因）以及您在ready() 函数中定义的变量不可用（超出范围）在click 函数中。您可以通过在ready 侦听器中设置click 侦听器来解决这两个问题：

$( document ).ready(function() {

var doc = new jsPDF();
var specialElementHandlers = {
    '#editor': function (element, renderer) {
        return true;
    }
};
$('#cmd').click(function () {
    doc.fromHTML($('#content').html(), 15, 15, {
        'width': 170,
            'elementHandlers': specialElementHandlers
    });
    doc.save('sample-file.pdf');
});

})

【讨论】：

【解决方案3】：

VQR ..... 一个问题，我的应用有时在没有网络的地方工作，所以下一行在没有网络的情况下无法工作，对吗？

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.5.3/jspdf.min.js"></script>

所以，我安装了它...

npm install jspdf --save

但是现在，我需要将哪些文件复制到我的 Js 地毯上才能正常工作？

var doc = new jsPDF();

【讨论】：