JavaScript在Mac和PC上的表现不同？我知道它不应该'；T

我已经创建了一个分页脚本，它需要一个很长的文本块并将其拆分为多个页面。首先，文本被加载到id为

#page

的div中。然后，脚本测量

#page

的高度，并计算它应该分成多少页才能放入

div

类

.detailsholder

将清除div.detailsholder，并在其中添加适当数量的页面div。（每个页面实际上都包含了#页面的整个文本，但上边距设置为负数，高度固定，溢出设置为隐藏，因此只显示适当的数量。）

它工作得很好，除了这个：Mac上的Safari和Firefox工作得很好，而Windows上的IE和Firefox则增加了一个额外的页面。由于页面的创建方式，如上括号中所述，最后一页显示为空白——文本上移太远，无法显示在页面

窗口中

这是密码。正如您所看到的，我正在使用jQuery

var descHeight = $('#page').outerHeight();
if (descHeight > 250 ) {
   var numberOfPages = Math.round(descHeight/210)+1; //Figure out how many pages
   var artistText = $('#page').html();               //Grab the text into a variable
   $('.detailsholder').empty();                      //Empty the container so we can fill
                                                     //it with pages
   for (i=0;i<=numberOfPages-1;i++) {                //Each page has the entire text
                                                     //content, but is shifted up and
      var shiftUp = 0-(210 * i);                     //cut off at the bottom.
      $('.detailsholder').append('<div id="page' + (i+1) + '" class="page" style="height:225px;"><div style="border:dotted 1px red;margin-top:' + shiftUp + 'px"' + artistText + '</div>');
   }
}

var descHeight=$（'#page'）.outerHeight（）；
如果（高度>250）{
var numberOfPages=Math.round（descHeight/210）+1；//计算出有多少页
var artistText=$（'#page'）.html（）；//将文本抓取到变量中
$（'.detailsholder'）.empty（）；//清空容器以便我们可以填充
//它有很多页
对于（i=0；i您是否在具有不同分辨率/字体设置的类似平台计算机上尝试过它

我认为这个问题可能更多地与显示设置和Javascript的CSS部分以及平台差异有关。我的CSS不太好，但您可能希望避免使用px，并尝试使用%来代替

以下内容可能有助于诊断：



（适用于Firefox）
（适用于IE）
（对于Safari，还没有亲自尝试过这个）
您是否在具有不同分辨率/字体设置的类似平台计算机上尝试过此功能

我认为这个问题可能更多地与显示设置和Javascript的CSS部分以及平台差异有关。我的CSS不太好，但您可能希望避免使用px，并尝试使用%来代替

以下内容可能有助于诊断：



（适用于Firefox）
（适用于IE）
（对于Safari，还没有亲自尝试过这个）
添加一些警报以查看计算结果。如果您在不同的浏览器中得到不同的结果，则必须进行调整以处理差异
添加一些警报以查看计算结果。如果您在不同的浏览器中得到不同的结果，则必须进行调整以处理差异脚本最后一行中的差异，第二个开始div标记：它似乎没有关闭。这可能会导致问题？
在脚本的最后一行中，第二个开始div标记：它似乎没有关闭。可能会导致问题？
我看到算法中有一个问题。
Math.round
应该是
Math.flo或
以提供正确的页数。为了了解为什么假定
descHeight
为
400
。那么您只需要两页高度
210
，但
Math.round（400/210）+1==3
。可能是这个问题与平台之间不同的标准字体大小相结合（这可能会影响
descHeight
并触发问题）是您观察到的行为的原因吗？
我看到算法中有一个问题。
Math.round
应该是
Math.floor
，以便给出正确的页数。为了了解为什么假设
descHeight
是
400
。那么您只需要两页高度
210
，但是
Math>.round（400/210）+1==3
。可能是这个问题与不同平台之间的不同标准字体大小相结合（这可能会影响
descHeight
并触发问题）你观察到这种行为的原因是什么？
好的眼睛，我不知道是否会导致HTML在这类事情上如此松懈的问题。仍然值得修复。+1好的眼睛，我不知道是否会导致HTML在这类事情上如此松懈的问题。仍然值得修复。+1