JavaScript导出Div到PDF
我正在尝试将div导出为PDF,问题是当我尝试将此div导出为PDF时,会出现以下错误: 未捕获的无效方向:[对象]。。。。。。。jspdf.min.js: 43 有人能帮我吗 有误图像 HTMLJavaScript导出Div到PDF,javascript,html,asp.net-mvc,Javascript,Html,Asp.net Mvc,我正在尝试将div导出为PDF,问题是当我尝试将此div导出为PDF时,会出现以下错误: 未捕获的无效方向:[对象]。。。。。。。jspdf.min.js: 43 有人能帮我吗 有误图像 HTML <script src="/plugins/jquery/js/jQuery-2.1.4.min.js"></script> <scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jspdf/0.9.0rc1/jspdf.
<script src="/plugins/jquery/js/jQuery-2.1.4.min.js"></script>
<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jspdf/0.9.0rc1/jspdf.min.js"></script>
<scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/0.4.1/html2canvas.min.js"></script>
<div id="renderPDF" class="tab-pane fade in active">
<div class="table-responsive panel">
<table class="table">
<tbody>
<tr>
<td class="text-success">
<i class="fa fa-user"></i> Nome
</td>
<td>@Model.Nome</td>
</tr>
<tr>
<td class="text-success">
<i class="fa fa-home"></i> Morada
</td>
<td>@Model.Morada</td>
</tr>
<tr>
<td class="text-success">
<i class="fa fa-phone"></i> Telemóvel
</td>
<td>@Model.Telemovel</td>
</tr>
<tr>
<td class="text-success">
<i class="fa fa-envelope"></i> E-mail
</td>
<td>@Model.Email</td>
</tr>
</tbody>
</table>
</div>
</div>
<button type="button" class="btn btn-primary btn-circle btn-xl" id="btnPrint" data-toggle="tooltip" title="PDF">
<i class="glyphicon glyphicon-floppy-disk"></i>
</button>
诺姆
@诺姆模型
莫拉达
@莫拉达模型
远程水平
@模型.远程移动
电子邮件
@模型。电子邮件
JavaScript
<script language="javascript">
var cache_width = $('#renderPDF').width(); //Criado um cache do CSS
var a4 = [595.28, 841.89]; // Widht e Height de uma folha a4
$(document).on("click", '#btnPrint', function () {
// Setar o width da div no formato a4
$("#renderPDF").width((a4[0] * 1.33333) - 80).css('max-width', 'none');
// Aqui ele cria a imagem e cria o pdf
html2canvas($('#renderPDF'), {
onrendered: function (canvas) {
var img = canvas.toDataURL("image/png", 1.0);
var doc = new jsPDF({ unit: 'px', format: 'a4' });
doc.addImage(img, 'JPEG', 20, 20);
doc.save('NOME-DO-PDF.pdf');
//Retorna ao CSS normal
$('#renderPDF').width(cache_width);
}
});
});
</script>
var cache_width=$('#renderPDF').width()//Criado um cache do CSS
VarA4=[595.28841.89];//uma folha的宽度和高度a4
$(文档)。在(“单击”上,“#btnPrint”,函数(){
//Setar o宽度da分区编号格式a4
$(“#renderPDF”).width((a4[0]*1.33333)-80).css('max-width','none');
//Aqui ele cria a imagem e cria o pdf
html2canvas($('renderPDF'){
onrendered:函数(画布){
var img=canvas.toDataURL(“image/png”,1.0);
var doc=新的jsPDF({单位:'px',格式:'a4'});
addImage文件(img,'JPEG',20,20);
doc.save('NOME-DO-PDF.PDF');
//雷托纳正常
$('#renderPDF')。宽度(缓存宽度);
}
});
});
不能将param jsPDF()函数设置为数据对象。a4是默认格式。不需要设置。您可以访问此链接以了解更多信息:
var cache_width=$('#renderPDF').width()//Criado um cache do CSS
VarA4=[595.28841.89];//uma folha的宽度和高度a4
$(文档)。在(“单击”上,“#btnPrint”,函数(){
//Setar o宽度da分区编号格式a4
$(“#renderPDF”).width((a4[0]*1.33333)-80).css('max-width','none');
//Aqui ele cria a imagem e cria o pdf
html2canvas($('renderPDF'){
onrendered:函数(画布){
var img=canvas.toDataURL(“image/jpeg”,1.0);
//var doc=new jsPDF({unit:'px',format:'a4'});//此行错误
var doc=new jsPDF('landscape');//默认值为纵向
addImage文件(img,'JPEG',20,20);
doc.save('NOME-DO-PDF.PDF');
//雷托纳正常
$('#renderPDF')。宽度(缓存宽度);
}
});
});
错误消息将有一个堆栈跟踪-将其追溯到代码的哪一行responsible@Geshode:编辑时,请确保改进帖子,不要引入新错误!“Errorä”或添加“…”。
<script language="javascript">
var cache_width = $('#renderPDF').width(); //Criado um cache do CSS
var a4 = [595.28, 841.89]; // Widht e Height de uma folha a4
$(document).on("click", '#btnPrint', function () {
// Setar o width da div no formato a4
$("#renderPDF").width((a4[0] * 1.33333) - 80).css('max-width', 'none');
// Aqui ele cria a imagem e cria o pdf
html2canvas($('#renderPDF'), {
onrendered: function (canvas) {
var img = canvas.toDataURL("image/jpeg", 1.0);
//var doc = new jsPDF({ unit: 'px', format: 'a4' });//this line error
var doc = new jsPDF('landscape'); // default is portrait
doc.addImage(img, 'JPEG', 20, 20);
doc.save('NOME-DO-PDF.pdf');
//Retorna ao CSS normal
$('#renderPDF').width(cache_width);
}
});
});
</script>