同步javascript调用

加载我正在处理的html页面（使用JQuery）的一部分涉及实例化几个javascript对象，每个对象向页面添加一个图像。对象构造函数使用

$（窗口）等待图像加载。load（）

获取它们的维度，并根据cookie值进行缩放

加载页面后（再次使用

$（window.load（）

），主页将使用

.hide（）

）隐藏大部分图像；它们稍后会再次出现

---

我遇到的问题是，在JS对象获取其尺寸之前，主页会隐藏图像。我需要主页等待所有对象完成图像操作，然后再隐藏图像。

不要将图像添加到页面中，并在加载后隐藏它们

---

加载它们，测量它们的大小（请参见，）并在需要时将它们添加到DOM中。

扩展@Bergi的答案：

通常的做法是在需要的地方渲染图像元素，但用其他1像素虚拟图像替换它们的

src

，并将真实源保存在其他地方（例如，在数据属性上）：

---

这会导致图像在完全加载并且您有机会缩放（或居中，或以其他方式预处理）之前不会显示

将有助于查看您正在使用的代码。听起来您需要在图像加载函数中使用回调来触发

隐藏

，而不是依赖

$（window）.load（）

。如果您确实需要将脚本链接在一起，请向我们展示它们，以便我可以告诉您如何调整它们。据我所知，图像不存在于源代码中，而是动态创建的：“加载[页面[…]的一部分涉及实例化几个javascript对象，每个对象都会向页面添加一个图像”啊，是的，我错过了。这就更容易了。

<img src="/img/dummy.png" data-original-src="/img/path/to/real-image.png">

$('img').each(function() {
   var originalImg = $(this);
   var externalImg = $('<img>').attr('src', originalImg.data('original-src'));
   externalImg.load(function() { 
        // measure, scale, center, and pre-process as you wish
        originalImg.attr('src', externalImg.attr('src'));
        originalImg.data('original-src', null);
   }); // you'll also have to use .complete() here, see links for details
}