单击按钮时使用Javascript将div下载为PDF时出错



我正试图使用JS在我的简历生成器中点击按钮时将简历下载为pdf,但不幸的是,页面加载后会立即调用该函数,而不是点击按钮时调用。我尝试了一些其他方法,包括按钮的箭头功能和onclick属性,尽管在下载后开始点击按钮,但pdf结果是空的。

代码:HTML:

<div class="container profile-box" id="f">
<!-- Code of whole cv template -->
</div>
<div class="col-md-12 text-center">
<button type="button" class="btn btn-primary" id="pdf" >Download Pdf</button>
</div>

JS:

var btnpdf=document.getElementById("pdf");

async function generatepdf(){

var downloading=document.getElementById("f");
let width1 = downloading.offsetWidth;
let height1 = downloading.offsetHeight;
var doc=new jsPDF('p','pt');
await html2canvas(downloading,{
allowTaint:true,
useCORS:true,
width:width1,
height:height1

}).then((canvas)=>{
//canvas convert to png
doc.addImage(canvas.toDataURL("image/png"),'PNG',10,10);
})
doc.save("cv.pdf");

}
btnpdf.addEventListener("click",generatepdf());

它对我有效。
您遇到了什么错误
是否包含jspdf?

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/1.3.2/jspdf.min.js"></script>

最新更新