4

我知道load()jQuery 中有一个事件在图像完成加载时触发。但是,如果在图像完成加载后附加事件处理程序怎么办?

是否有类似$('#myimage').isLoaded()检查图像是否已加载的属性?

4

3 回答 3

10

您可以检查complete图像的属性。

是否有类似$('#myimage').isLoaded()检查图像是否已加载的属性?

不,但你可以这样做:)

jQuery.fn.isLoaded = function() {
    return this
             .filter("img")
             .filter(function() { return this.complete; }).length > 0;
};

true如果集合中的所有图像都已加载,并且false一个或多个图像未加载,这将产生。您可以对其进行调整以满足您的需求。

于 2012-07-07T08:48:14.340 回答
2

纯JS就够了。图像对象具有完整的属性。在这里查看:http ://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_img_complete

于 2012-07-07T08:47:11.497 回答
1

它有点骇人听闻,我不确定它是否会在任何地方都有效。自己做测试。

$.fn.isLoaded = function(message) {
  var $this = $(this);
  if($this.height() > 0 && $this.width() > 0){
     return true;
  }
  return false;
};

$('#myimage').isLoaded()

编辑:

这适用于ff和chrome,

$.fn.isLoaded = function(message) {
  var $this = $(this); 
  $this.hide();   // becaues firefox gives a 24*24 dimension
  var w = this[0].width;
  var h = this[0].height;  
  $this.show(); 
  if(w > 0 || h > 0){ 
    return true;
  } 
  return false;
}; 
console.log($('#myimage').isLoaded());

但是如果你隐藏图像 ie 给 0 作为宽度和高度,所以它会失败 ie。即,您不应该隐藏图像。

我希望,有人可以结合这两个功能来制作跨浏览器的东西,或者至少它肯定会帮助某人。

于 2012-07-07T08:45:10.943 回答