1. ホーム
  2. javascript

[解決済み] jsPDF fromHTML()でHTMLが表示されない

2022-03-12 08:29:21

質問

簡単なjavascriptを作成しています。 jsPDF libを使用していますが、スクリプトは空白のPDFを読み込みます。

これはコードです。

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <title>fromHTML EX</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta name="generator" content="Geany 1.22" />

    <script type="text/javascript" src="/root/utils/jquery-1.11.2.min.js"></script>
    <script type="text/javascript" src="/root/utils/jsPDF-master1/jspdf.plugin.standard_fonts_metrics.js"></script>
    <script type="text/javascript" src="/root/utils/jsPDF-master1/jspdf.plugin.split_text_to_size.js"></script>

    <script type="text/javascript" src="/root/utils/jsPDF-master1/js/basic.js"></script>
    <script type="text/javascript" src="/root/utils/jsPDF-master1/jspdf.js"></script>
    <script type="text/javascript" src="/root/utils/jsPDF-master1/jspdf.plugin.from_html.js"></script>

  <script type="text/javascript">
    function PDF1(){
    var doc = new jsPDF();          
    var elementHandler = {
    '#ignorePDF': function (element, renderer) {
    return true;
    }
    };
    var source = window.document.getElementsByTagName("body")[0];
    doc.fromHTML(
        source,
        15,
        15,
        {
        'width': 180,'elementHandlers': elementHandler
        });

    doc.output("datauri");
    }

    PDF1()
  </script>

</head>

 <body>
     ASDSADASDASDSA
      <div>
    <p id="ignorePDF">don't print this to pdf</p>

      <p><font size="3" color="red">print this to pdf</font></p>
    </div>




  </body>


</html>

呼び出し関数をページの一番下に配置しようとしましたが、まだうまくいきません。 どなたか助けていただけませんか?

解決方法は?

を使用しているため jQuery を試してみてください。

$( document ).ready(function() {
  //console.log( "ready!" );
  PDF1();
});

また、注意してください。 必須ではありません)を使用することができます。

var source = $("body")[0];

テストに使用するコードページ

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title>fromHTML EX</title>
  <meta http-equiv="content-type" content="text/html;charset=utf-8" />
  <meta name="generator" content="Geany 1.22" />

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
  <script src="https://parall.ax/parallax/js/jspdf.js"></script>

  <script type="text/javascript">
  function PDF1(){
    var doc = new jsPDF();
    var elementHandler = {
      '#ignorePDF': function (element, renderer) {
        return true;
      }
    };
    var source = window.document.getElementsByTagName("body")[0];
    doc.fromHTML(
      source,
      15,
      15,
      {
        'width': 180,'elementHandlers': elementHandler
      });

      doc.output("datauri");
    }

    $( document ).ready(function() {
      //console.log( "ready!" );
      PDF1();
    });
</script>

  </head>

  <body>
    ASDSADASDASDSA
    <div>
      <p id="ignorePDF">don't print this to pdf</p>

      <p><font size="3" color="red">print this to pdf</font></p>
    </div>




  </body>
  </html>