Question

您有一个具有以下结构的动态内容HTML

<Div id=1>
.....
</div>
and then 
<Div id=N>
.....
</div>

我正在尝试在IE6中打印预览（是IE6！）由于IE6不支持page-break-inside：避免，我使用的是jquery

在ready（）函数中，我正在检查每个div的高度，然后添加到其他div的列表中。高度。如果总和超过700（例如），我插入一个带有page-break-after属性的HR标记。

所以以这种方式我可以在IE6中显示分页符

但是，在正常情况下，用于获取元素高度的jquery返回0。也就是说，如果没有IE错误抛出，则元素高度为0

如果存在IE错误，例如Null引用或未定义，则jquery元素高度返回正确的高度。

请帮助解决此问题

用于添加HR标记以显示页面拆分的Jquery代码

//Function to show the page break
function PageBreak()
{
    var i1=0;
    var prevId='';
    var heights='';
    var CurrentDiv=0;
    var CurrentDivHeight=0;

    //For each DIV which contains the medication, show the page break at appropriate rows
    $(".divtblPrint").each(function(i) 
    {
        //Check the current Height
        //if currentHeight + sum of previous heights is > HeightToCheck then 

        CurrentDivHeight=$(this).outerHeight(true);

        if((i1+CurrentDivHeight)>HeightToCheck)
        {
            var HTML='';
            HTML+="<hr class='pagebreak' style='visibility:hidden;'/>";
            $(this).before($('<div class="new">'+HTML+'</div>'));
            //reset the counters since this is fresh page
            i1=CurrentDivHeight;
            prevId='';
            //return;
        }
        else //height not yet crossed, so keep loops
        {
            prevId=$(this).attr('id');
            i1+=CurrentDivHeight;
        }

    });

}

分页风格：

<style>.pagebreak {page-break-after: always;}</style>

Answer 1

我删除了您的评论并添加了我自己的评论。我认为主要的问题是你忘了定义HeightToCheck。您还有许多未使用的代码。你可以省略它们。请检查代码段。

＆＃13;

function PageBreak()
{
    var i1=0;
    var prevId=''; //not in use?
    var heights=''; //not in use?
    var CurrentDiv=0; // not in use?
    var CurrentDivHeight=0; // Ok
    var HeightToCheck=200; //Did you forget this?

    $(".divtblPrint").each(function(i) 
    {

        CurrentDivHeight=$(this).outerHeight(true);

        if((i1+CurrentDivHeight)>HeightToCheck)
        {
            var HTML='';
            HTML+="<hr class='pagebreak' style='visibility:hidden;'/>";
            $(this).before($('<div class="new">'+HTML+'</div>'));
            i1=CurrentDivHeight; // Should this be i1=0 ?
            prevId=''; // not in use?

        }
        else
        {
            prevId=$(this).attr('id'); // not in use?
            i1+=CurrentDivHeight;
        }
        
        alert(i1);
    });

}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="divtblPrint">a</div>
<div class="divtblPrint">b</div>
<div class="divtblPrint">c</div>
<br>
<a onclick="PageBreak()">Click here to start loop</a>

＆＃13;

jquery：元素高度返回0

1 个答案: