Question

我有一些代码，当页面加载时获取图像的高度，然后相应地调整其容器div的大小。这工作正常，除非它第一次加载页面或我用ctrl + f5进行硬刷新，然后它不起作用。我尝试过使用

$('#div img').load(function() {
// put the code here
});

但是我遇到了同样的问题。任何人都知道为什么会这样吗？

这是我的代码：

maxheight = 0;
$('#venue #main-img img').each(function() {
   height = $(this).height();
   if(height > maxheight) {
      maxheight = height;
   }
   $(this).hide();
});
$('#venue #main-img').animate({ height: maxheight });
$('#venue #main-img img').first().show();

抱歉应该说。代码在$（document）.ready（）

之内

Answer 1

尝试在$(window).load中调用您的代码。这将在所有图像加载后运行。

$(window).load(function () {
   // run code
});

或者你可以试试imgload插件。

Answer 2

我也有同样的问题。经过一些研究后，似乎浏览器需要为图像预定义值才能重置大小。因此，在初始加载时，它会混乱，但在重新加载时，图像的高度会保留，因此javascript可以正常工作。您需要在图像的初始高度进行编码，以便JS可以正确调整它们的大小。

Answer 3

如果您的图像没有在HTML或CSS中指定宽度/高度，则在下载图像之后才能知道它们的宽度/高度。

加载DOM时会激活

$(document).ready，但可能在下载辅助媒体（如图像）之前触发。这意味着当您的浏览器重新下载图像时，您的宽度/高度可能为0。

也许你可以使用像this这样的东西。 “imagesLoaded”插件特别有用（虽然它的代码暗示$(imgs).load应该适合你＆gt;。＆lt;）。

Answer 4

你可能想尝试这样做：

$(document).ready(function(){
//code here
});

Answer 5

您可以使用一些jQuery插件，例如https://gist.github.com/797120/b7359a8ba0ab5be298875215d07819fe61f87399

硬刷新后，jquery .load（）不起作用

5 个答案: