使用jsPDF通过jquery生成div的PDF

i want to generate a PDF file from a div using jsPDF, it works flawless in static code, but i want to do it with generate code, like this:

我想使用jsPDF从div生成一个PDF文件,它在静态代码中完美无缺,但我想用生成代码来完成它,如下所示:

<button id = "click">Click</button>
<div id = "here"></div>

<script type="text/javascript">
$("#click").click(function(){
  var write = '<div id = "example">Hello</div><button id = "click_pdf">PDF</button>';
  $("#here").html(write);
});

$("#click_pdf").click(function(){
  var doc = new jsPDF;
  doc.fromHTML($("#example").get(0),10,10,{
     'width': 180
  }
  doc.save("Test.pdf");
});
</script>

But is not working, not ever display an error message in the console

但是没有工作,不会在控制台中显示错误消息

Also i try to change an onclick event instead of the jquery event, like this:

此外,我尝试更改onclick事件而不是jquery事件,如下所示:

var write = '<div id = "example">Hello</div><button onclick = click_pdf()>PDF</button>';
...
function click_pdf(){
   var doc = new jsPDF;
   ...
}

In this case, appears an "Uncaught TypeError: Cannot read property '#' of undefined" error.

在这种情况下,出现“未捕获的TypeError:无法读取属性'#'未定义”错误。

Also i try to generate the function click_pdf() or the $("#click_pdf").click inside the $("#click").click function without results. Any ideas?

此外,我尝试生成函数click_pdf()或$(“#click_pdf”)。单击$(“#click”)。单击函数没有结果。有任何想法吗?

1 个解决方案

#1

Try this:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
     <script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/jspdf/0.9.0rc1/jspdf.min.js"></script>
    <script>

    $(function(){
    $("#click").click(function(){
      var write = '<div id = "example">Hello</div><button id= "click_pdf">PDF</button>';
      $("#here").html(write);
    });
    $(document).on("click","#click_pdf",function(){
      var doc = new jsPDF;
var specialElementHandlers = {
    '#editor': function (element, renderer) {
        return true;
    }
};
        doc.fromHTML($('#example').html(), 15, 15, {
            'width': 170,
            'elementHandlers': specialElementHandlers
        });
      doc.save("Test.pdf");
    });
    });

    </script>


    <input type="button" id="click" value="Click!"/>
    <div id="here"></div>

DEMO