jsPDF не определен в javascript

Question

Я импортировал библиотеку 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>

Answer 1

Я думаю, что ваш код кажется правильным, но есть проблема с cdn. Я использовал здесь отладочную.

Вот один созданный мной рабочий пример, на который вы можете сослаться. Если вы не видите загрузки pdf из-за ограничения переполнения стека, используйте эту скрипку для проверки.

Рабочий Скачать демо в формате PDF

Я использовал ссылку 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>

Answer 2

Я обнаружил две основные проблемы, решенные в этой вилке . Во-первых, вы не ссылались на jspdf. Вы можете сделать это в html-коде:

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

Во-вторых, вы добавляете clickпрослушиватель событий вне ready()функции. Это, в свою очередь, вызывает две проблемы: событие может не быть прикреплено (убедитесь, что вы проверили причину ready()функции), и переменные, которые вы определяете в ready()функции, недоступны (выходят за рамки) в clickфункции. Вы можете исправить обе проблемы, установив clickслушателя внутри readyслушателя:

$( 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');
});

})

Answer 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();