如何在我的JavaScript运行之前保证图像加载？

我试图使用如何在我的JavaScript运行之前保证图像加载？

img.onload = function() 
         { ... }

，以保证图片，以便继续进行我的脚步满载。这种方法对我来说不起作用，因为我需要在第一个图片加载后加载另一张图片（我有一个必须一个接一个地加载的图片数组，具有特定的时间间隔）。

有没有其他的选择（也许jQuery）来保证图片被加载？

来源

2014-10-27 Max Z

你的目的是什么？你想制作一个预装载器吗？ – Nick 2014-10-27 08:47:54

'.ready（）'怎么样？ http://api.jquery.com/ready/ – Aaroniker 2014-10-27 08:47:59

@Nick是的，我有一个预装。你可以看到[这里]的网页（http://brain.netii.net/practice_asso.html）。 – 2014-10-27 08:50:18

from jquery documentation：加载事件发送到一个元素，当它和所有的子元素已被完全加载。这个事件可以发送到与URL相关的任何元素：图像，脚本，框架，iframe和窗口对象。

，所以你可以创建一个包装DIV您的图片，然后再去做这样的：

$("#imageWrap").load(function() { 
    // next steps go here 
});

---编辑---

因为负载情况下可能无法正常火，我偶然发现了这一个： JavaScript: Know when an image is fully loaded

$.fn.imageLoad = function(fn){ 
    this.load(fn); 
    this.each(function() { 
     if (this.complete && this.naturalWidth !== 0) { 
      $(this).trigger('load'); 
     } 
    }); 
}

会是更好的解决方案！

来源

2014-10-27 08:50:54 errand

感谢您的回复。我试图实现这种方式，但我有问题。在第一次迭代时，一切正常，但是，在我提交表单后出错了。如果它不是太麻烦，请看看实现：http://brain.netii.net/tempPractice.html？ – 2014-10-27 09:49:26

sry - 我的错，我只是复制了相关的部分，但不是完整的解决方案......但是 - 我不想窃取解决方案...所以请转到链接的stackoverflow主题，并自己阅读。 $ .fn。函数声明，是一个jQuery原型声明 - 如果我的控制台显示它正确，你只需将它粘贴到你现有的代码中。那不行！ – errand 2014-10-27 09:56:27

这可以很容易地用一个名为imagesLoaded的jquery插件完成。你可以这样使用它：

for(var i = 0 ; i < img_array.length ; i++) { 
    imagesLoaded(img_array[i], function(){ 
     // Stuff to do after the image is loaded 
    }); 
}

来源

2014-10-27 09:01:08 lapin

如何在我的JavaScript运行之前保证图像加载？

回答

相关问题