generate dynamic pdf with jsPDF library based on user input (fix error)

问题

So, I actually have this functionality working. With the below JS. The problem is upon submit, the next page should not reflect these changes, but instead ONLY reflect in the generated PDF. Currently the PDF is being generated correctly, but the second page or second view (what is generated in the PDF is shown on the current) this should not be the case, this static page should remain as is and just have the reflected changes viewable in the generated PDF.

Here is actually the original question - though the scope has transformed into this current question hints the new question, but URL for sample purposes as it may help. insert custom HTML content to checkbox containers of items 'checked'

  texts = {
        item1: 'Item Box 1 Content <strong>html</strong> right here!',
        item2: 'Now its Item Box 2 <strong>html</strong> content here !',
        item3: 'This is the example <strong>html</strong> of Item box 4!',
        item4: 'Item box number 5 <strong>html</strong> content is here!',
      }
      $("#container").css('background', '#fff')

       $('.download-pdf').click(function() {

        notChecked = $("input[type=checkbox]:not(:checked)").parent();
        notChecked.hide();
        yesChecked = $("input[type=checkbox]:checked").parent();

        $.each(yesChecked, function( index, el ) {
          $(el).show().html(texts[$(el).attr('id')]);
        });

     var pdf = new jsPDF('p', 'pt', 'a4');

        pdf.addHTML(document.getElementById('records'), function() {
            // add here

        }); 

        var file = 'test';
        if (typeof doc !== 'undefined') {
            doc.save(file + '.pdf');
        } else if (typeof pdf !== 'undefined') {
            setTimeout(function() {
                pdf.save(file + '.pdf');
                // $("#item4").hide();

            }, 2000);
        } else {
            alert('Error 0xE001BADF');
        }

    });

Attempt:

 var pdf = new jsPDF('p', 'pt', 'a4'); // moved everything relevant to be called within jsPDF object here

    pdf.addHTML(document.getElementById('records'), function() {
    // add here

    texts = {
        item1: 'Item Box 1 Content <strong>html</strong> right here!',
        item2: 'Now its Item Box 2 <strong>html</strong> content here !',
        item3: 'This is the example <strong>html</strong> of Item box 4!',
        item4: 'Item box number 5 <strong>html</strong> content is here!',
         }

        notChecked =  $("input[type=checkbox]:not(:checked)").parent();
        notChecked.hide();
        yesChecked = $("input[type=checkbox]:checked").parent();

        $.each(yesChecked, function( index, el ) {
          $(el).show().html(texts[$(el).attr('id')]);
        });

    });

来源：https://stackoverflow.com/questions/34145059/generate-dynamic-pdf-with-jspdf-library-based-on-user-input-fix-error

标签

javascript

jquery

jspdf