【问题标题】:jsPDF is not defined error in html project?jsPDF未在html项目中定义错误?
【发布时间】:2019-01-03 09:55:28
【问题描述】:

我正在实现 jsPdf 示例并有示例 html 项目,其中我包含 jquery 和 jspdf cdn 链接以生成 pdf。这是我的代码

<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script> src = "https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js"</script>
    <script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
</head>

<body>
    <div id="content">
        <p>Testing testing testing</p>
    </div>
    <button type="button" id="export">Export To Pdf</button>
    <script>
        var doc = new jsPDF();
        $('#export').click(function () {
            doc.fromHTML($('#content').html(), 15, 15, {
                'width': 170
            });
            doc.save('sample-file.pdf');
        });
    </script>
</body>

</html>

但它给出了这个错误

Uncaught ReferenceError: jsPDF is not defined
at index.html:19

我的代码有什么问题?

【问题讨论】:

  • 导入脚本时,它将导出您可能使用的变量/引用(即 jsPDF)。确保它被正确导入并记录通过头部和主体加载的脚本。我建议使用 webpack 或 requirejs 以避免全局命名空间混乱。

标签: javascript html jspdf html-to-pdf


【解决方案1】:

错误在这一行-

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

src 应该在脚本标签内

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

用于导出和渲染

$('#export').click(() => {
    var pdf = new jsPDF('p','pt','a4');
    pdf.addHTML(document.body,function() {
        pdf.save('web.pdf');
    });
})

【讨论】:

  • 谢谢我修好了。如何导出具有完整样式的 html?我也在使用引导程序
  • 我有一整页带有“模态”和其他元素。而且我只想导出具有完整样式的 Modal,所以我必须指定 .addHtml 函数而不是 fromHtml?我用谷歌搜索了它,我发现我还必须使用 Html2Canvas 插件和 jspdf?
  • 你能告诉我任何将引导内容导出为 pdf 的小例子吗?
  • 我试过了。它给出了这个错误Uncaught (in promise) Proxy must be used when rendering url
  • 终于!!谢谢兄弟
【解决方案2】:

https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.4/jspdf.min.js 的脚本标签修复为

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

【讨论】:

  • thanx,但现在我在另一个项目中使用它,但现在它给出错误“未捕获的类型错误:无法读取未定义的属性 '#'”
  • 我测试了它工作正常的代码。可能是您的其他项目有问题。
  • 如何使用实际 Html 的属性样式导出?
  • 这是另一个问题
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2021-12-17
  • 1970-01-01
  • 2014-05-25
  • 2016-05-30
  • 1970-01-01
相关资源
最近更新 更多