Javascript 为什么jsPDF只输出较大文档上的空白页？

我有一个调用html2canvas的函数。如果画布只有1个pdf“页面”大，它就可以正常工作。如果它大于这个值，我在while语句中将画布分解成更小的画布，然后一次向PDF添加1

它非常适合我的一个页面，它在PDF中生成了大约5个“页面”，但我有一个不同的页面，它可能是无法生成的页面的3倍，这令人难以置信地沮丧

正在输出PDF，但如果有任何数据，则该PDF完全为空，具有正确的页数为什么它是空白的？我如何才能输出正确的信息？我已经绞尽脑汁想了一段时间了，如果有任何帮助，我将不胜感激

function exportHTMLToPDF( selector, pdfData ){
    html2canvas( $( selector ), {
        onrendered: function ( canvas ) {
            //Size variables
            var posFromTop = 0; //The position from the top
            var canvasLeft; 
            // width, height, and ratio (w x h) of a canvas 'page'
            var pageWidth, pageHeight, pageRatio;
            //Upright oritentation (portrait)
            if ( pdfData.orientation == 'p' ) {
                pageRatio = 0.77272727272;
            } else { //Landscape orientation
                pageRatio = 1.29411764706;
            }
            pageWidth = canvas.width;
            pageHeight = pageWidth / pageRatio;
            canvasLeft = canvas.height * pageWidth / pageWidth;
            //Set up the pdf
            var doc = jsPDF( pdfData.orientation, 'mm', [pageWidth, pageHeight] );
            //Get canvas context
            var ctx = canvas.getContext( '2d' );
            //Set that this is the first page so doc.addPage() isn't called
            var firstPage = true;
            //Get the next 'page'
            var imgData;
            //Create a second canvas to put the imgData in
            var c2 = document.createElement( 'canvas' );
            c2.setAttribute( 'width', pageWidth );
            c2.setAttribute( 'height', pageHeight );
            //Get a second canvas context to put the image on
            var ctx2 = c2.getContext( '2d' );
            //How many pages the pdf document will be
            var pages = canvasLeft / pageHeight;
            var imageURI;
            //While there are still more pages
            while ( pages >= 0 ) {
                //Convert the next part of the canvas to image data
                imgData = ctx.getImageData( 0, posFromTop, pageWidth, pageHeight );
                //Change the transparancy into white space
                for ( var i = 0; i < imgData.data.length; i += 4 ) {
                    if ( imgData.data[i + 3] == 0 ) {//If transparent
                        imgData.data[i] = 255;
                        imgData.data[i + 1] = 255;
                        imgData.data[i + 2] = 255;
                        imgData.data[i + 3] = 255;
                    }
                }
                //Put the image on the canvas
                ctx2.putImageData( imgData, 0, 0 );
                //If the document needs another page, add one
                firstPage ? firstPage = false : doc.addPage();

                //Turn the canvas with the newest image data into DataURL and put that 
                //on the pdf, with compression (the 'FAST' part)
                doc.addImage( c2.toDataURL( 'image/png' ), 'PNG', 0, 0, pageWidth, pageHeight, null, 'FAST' );
                pages--;
                posFromTop += pageHeight;
            }
            //Saves the pdf
            doc.save( pdfData.fileName + '.pdf' );
        }
    } );
}

函数导出HTMLTOPDF（选择器，pdfData）{
html2canvas（$（选择器）{
onrendered：函数（画布）{
//大小变量
var posFromTop=0；//从顶部开始的位置
var canvasLeft；
//画布“页面”的宽度、高度和比率（宽x高）
变量pageWidth、pageHeight、pageRatio；
//垂直方向（纵向）
如果（pdfData.orientation='p'）{
页面比率=0.77272；
}else{//横向
页面比率=1.29411764706；
}
pageWidth=canvas.width；
页面高度=页面宽度/页面比率；
canvasLeft=canvas.height*pageWidth/pageWidth；
//设置pdf
var doc=jsPDF（pdfData.orientation，'mm'，[pageWidth，pageHeight]）；
//获取画布上下文
var ctx=canvas.getContext（'2d'）；
//设置这是第一个页面，以便不调用doc.addPage（）
var firstPage=true；
//获取下一个“页面”
var imgData；
//创建第二个画布以放置imgData
var c2=document.createElement（'canvas'）；
c2.setAttribute（'width'，pageWidth）；
c2.setAttribute（'height'，pageHeight）；
//获取第二个画布上下文以放置图像
var ctx2=c2.getContext（'2d'）；
//pdf文档将有多少页
var pages=画布左侧/页面高度；
var-imageURI；
//虽然还有更多的页面
而（页面>=0）{
//将画布的下一部分转换为图像数据
imgData=ctx.getImageData（0，posFromTop，pageWidth，pageHeight）；
//将透明度更改为空白
对于（变量i=0；i

结果是，我的选择器超出了画布的最大大小，因此呈现为空白。经过一些挖掘，最大尺寸（铬）为268435456像素。我试图创建的div略高于270000000像素

我的解决方案是在上半部分添加一个类

firstHalf

，在下半部分添加

secondHalf

，然后显示另一个类。
然后，我在传入jsPDF

doc

时调用了exportHTMLToPDF两次，以便它使用同一个

以一种更系统的方式，可以用数字来隐藏多个“部分”。

.part1

、

.part2

等。然后使用传入的变量对它们进行迭代

function exportHTMLToPDF( selector, pdfData, doc ){
    var currentPart = pdfData.curPart;
    var lastPart = pdfData.lastPart;
    html2canvas( $(selector), {
        onrendered: function (canvas){
            //**Get page size data**//
            if( doc == null ){
                doc = jsPDF( 'p', 'mm', [pageWidth, pageHeight] );
            }
            //**Add the current page to the doc**//
            //If this is the last page, save
            if( currentPart == lastPart ){
                doc.save( pdfData.fileName + '.pdf' );
            } else {
                //Else call this function again, for the next page
                $('.part' + currentPart ).hide();
                $('.part' + ( currentPart + 1 ).show();
                pdfData.curPart = currentPart + 1;
                exportHTMLToPDF( selector, pdfData, doc );
            }
        }
    } );
}