Question

我有一些具有不同高度的物品（例如200个物品）的清单，我想将其打印在A4纸上。纸张具有页眉（公司徽标等）和页脚（页码等），A4纸的剩余空间是应放置项目列表的位置（例如，高度为180mm的矩形）。

如何计算每页180mm高的矩形中可以容纳多少个项目，从而使我能够打印必要的页面数以包含所有200个项目？

我尝试获取像素的可用高度 <div style=’height: 180mm’></div> 使用clientHeight，然后将这些项一个接一个地添加到另一个div，并继续确定其高度，直到与第一个div相同为止。

然后，我打印出一个页面，其中包含特定数量的项目，这些项目应适合A4纸的180mm矩形，然后继续执行列表中的下一个项目。

问题是由于dpi / ppi的差异，相当于屏幕上180mm高的像素与打印机上180mm高的像素不同，所以我最终得到了180mm矩形的一半，多余的页数。

对如何进行有任何想法吗？

翻录我尝试过的代码：

    HTML:
<div id="calcsize" style="width: 100%; height: auto"></div>

JAVASCRIPT:
//get the size in px of a 180mm div
document.getElementById("calcsize").innerHTML = "<div style='width: 100%; height: 180mm'></div>";
var boxh= $("#calcsize").outerHeight(); //height in px of the 180mm box

//add items to div until it’s full
var contents = “<div style=’width: 100%; height: auto’>”;
for(var i=0; i<200; i++)
{
contents += “<div style=’margin-bottom: 10mm’>Printing item “ + i + ”</div>”;
document.getElementById("calcsize").innerHTML = contents + “</div>”;
var boxi= $("#calcsize").outerHeight();
if(boxh<=boxi) break; //filled the 180mm div
}

//print the list on a 180mm box
var printlist=”<div style=’height: 180mm; border: 1px solid black>” + contents + “</div></div>”;
var mywindow = window.open('', 'PRINT', 'height=auto');
    mywindow.document.write('<html><head><title>' + tit + '</title>');
    mywindow.document.write('</head><body>');
    mywindow.document.write(printlist); 
    mywindow.document.write('</body></html>');
    mywindow.document.close();
    mywindow.focus();

预先感谢，迪雷兹

屏幕与打印机<div>高度

0 个答案: