Generate pdf from HTML in div using Javascript

前端 未结 12 1005
你的背包
你的背包 2020-11-22 06:10

I have the following html code:



    
        

don\'t print th

12条回答
  •  别那么骄傲
    2020-11-22 06:44

    i use jspdf and html2canvas for css rendering and i export content of specific div as this is my code

    $(document).ready(function () {
        let btn=$('#c-oreder-preview');
        btn.text('download');
        btn.on('click',()=> {
    
            $('#c-invoice').modal('show');
            setTimeout(function () {
                html2canvas(document.querySelector("#c-print")).then(canvas => {
                    //$("#previewBeforeDownload").html(canvas);
                    var imgData = canvas.toDataURL("image/jpeg",1);
                    var pdf = new jsPDF("p", "mm", "a4");
                    var pageWidth = pdf.internal.pageSize.getWidth();
                    var pageHeight = pdf.internal.pageSize.getHeight();
                    var imageWidth = canvas.width;
                    var imageHeight = canvas.height;
    
                    var ratio = imageWidth/imageHeight >= pageWidth/pageHeight ? pageWidth/imageWidth : pageHeight/imageHeight;
                    //pdf = new jsPDF(this.state.orientation, undefined, format);
                    pdf.addImage(imgData, 'JPEG', 0, 0, imageWidth * ratio, imageHeight * ratio);
                    pdf.save("invoice.pdf");
                    //$("#previewBeforeDownload").hide();
                    $('#c-invoice').modal('hide');
                });
            },500);
    
            });
    });
    

提交回复
热议问题