Question

我已经看过以下主题：

Jquery Loading problem on first load / hard refresh

这似乎是我遇到的问题的一些逆版本。在这种情况下，硬刷新是问题，在这种情况下，它是解决方案。

由于设计复杂的Web应用程序UI以处理不同的显示器高度的一些问题，我决定转向jquery来改变我的高度。我最初使用的是百分比高度，但是这些导致了点处的大间隙，并且使用最大和最小高度被证明很难将元素拖出上下文。如果没有启用JavaScript，应用程序的使用会慢得多（尽管它是基于渐进增强功能），因此假定用户将其打开。那是那些建议使用CSS解决方案的人。

~~测试链接~~ 由于域名不再有效，此内容已被删除

问题是，当页面通过超链接加载时，它的大小正确 - 如果你打开它，你应该看到这个，黄色/绿色框底部和浏览器底部之间大约30px。然而刷新它（您可能需要刷新几次）并且您将看到黄色框从页面底部消失，绿色框拉伸以加入它。这只发生在我的服务器上 - 我在本地主机上开发它时从未注意到这个错误，因为它没有发生。

jquery代码位于sandpit1.1webservices.co.uk/ground-control/examples/scripts/jumpers.js，特定代码段为：

function loadResize()
{
 //var window=$(window).height();
 var window=$('div.main').height();
 //window=parseInt(window);
 window-=50;
 $('div.staff ul').css('height',window);
 window-=175;
 $('div.loads').css('height',window);
 window-=150;
 $('div.loads div.list').css('height',window);
}

你可以看到我已经注释了一些内容，实际代码中还有更多内容供测试。当测试开始时窗口高度被警告时，它在我的浏览器上显示为885（1024px屏幕高度），然而刷新提供1133和1785之间的随机值。执行硬刷新或页面加载并将其返回到885.该函数被调用就在document.ready：

的最后

$(window).resize(loadResize);
loadResize();

我以前有调整大小事件触发器本身但是在它导致问题时将其删除。

有什么想法吗？

Answer 1

我最终通过将loadResize()功能从$(document).ready()事件移至$(window).load()事件来解决此问题。这是正确的，因为在构造DOM之后但在下载其他元素之前，文档就绪了。出于这个原因，图像和自定义字体（两者都在页面上）等项目影响了大小计算 - 根据网络速度和当时加载的内容，将为第一个事件给出不同的高度。

Answer 2

尝试将其写为$（函数loadresize（）{并以}结尾;）

Jquery，.height（）更改页面刷新但不加载

2 个答案: