我正在尝试使用jsPDF
从PHP页面创建PDF文件,但它不起作用,我不知道什么是错的。
有人可以帮助我吗?
首先我有Iframe
。我要转换的页面显示在Iframe中:
I帧:
<?php
<iframe id="frame" name="frame" width="100%" height="1160px" frameborder="0" src="./page.php?id=' . $_GET['id'] . '"></iframe>
<button id="cmd">Button</button>
?>
当我点击Button
时,以下脚本应将页面转换为PDF
脚本
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>
<script type="text/javascript">
var doc = new jsPDF();
var specialElementHandlers = {
'#editor': function(element, renderer){
return true;
}
};
$('#cmd').click(function () {
doc.fromHTML($('frame').get(0), 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});
doc.save('sample-file.pdf');
});
</script>
但是当我点击Button
时。什么都没发生。有人知道什么是错的吗?
答案 0 :(得分:5)
您必须获取iframe的html,因此请使用contents()
函数,然后获取iframe的documentElement
:
<iframe id="frame" name="frame" width="100%" height="1160px" frameborder="0" src="http://localhost/"></iframe>
<button id="cmd">Button</button>
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>
<script type="text/javascript">
var doc = new jsPDF();
var specialElementHandlers = {
'#editor': function(element, renderer){
return true;
}
};
$('#cmd').click(function () {
doc.fromHTML($('#frame').contents().find('html').html(), 15, 15, {
'width': 170,
'elementHandlers': specialElementHandlers
});
doc.save('sample-file.pdf');
});
</script>
注意:如果您的iframe源页面或其中的一部分受x-frame-options
标题保护,则无法访问它的html。
答案 1 :(得分:1)
<button onclick="cmd()">Button</button>
将此更改为
<button id="cmd">Button</button>
您正在使用id调用JS中的click事件。或者将onclick事件更改为名为cmd的函数。
答案 2 :(得分:1)
显然,jsPDF有限制和/或错误。复杂的表(特别是使用colspans)存在问题。它会抛出javascript错误,从而停止渲染器,这就是为什么你得到空白的pdf。
https://github.com/MrRio/jsPDF/issues/516
https://github.com/MrRio/jsPDF/issues/595
这里发布了一个分叉:https://github.com/jutunen/jsPDF-table_2但我不确定它是否解决了jsPDF的其他限制。