检查是否在jQuery(或纯JavaScript)中加载了图像
我知道jQuery中有一个检查是否在jQuery(或纯JavaScript)中加载了图像,javascript,jquery,image,loaded,Javascript,Jquery,Image,Loaded,我知道jQuery中有一个load()事件,当图像加载完成时会触发该事件。但是,如果在映像完成加载后附加了事件处理程序,该怎么办 是否有类似于$(“#myimage”).isLoaded()的属性来检查图像是否已加载?有点粗糙,我不确定它是否适用于任何地方。 自己做测试 $.fn.isLoaded = function(message) { var $this = $(this); if($this.height() > 0 && $this.width() >
load()
事件,当图像加载完成时会触发该事件。但是,如果在映像完成加载后附加了事件处理程序,该怎么办
是否有类似于
$(“#myimage”).isLoaded()的属性来检查图像是否已加载?有点粗糙,我不确定它是否适用于任何地方。
自己做测试
$.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就失败了。对于ie,你不应该隐藏图像
我希望,有人能将这两种功能结合起来,打造出一款跨浏览器的产品,或者至少它肯定会对某些人有所帮助。简单的JS就足够了。图像对象具有完整属性。
请在此处查看:您可以检查图像的属性
是否有类似于$('#myimage').isLoaded()的属性来检查图像是否已加载
不,但你可以做到:)
如果集合中的所有图像都已加载,则会生成true
;如果未加载一个或多个图像,则会生成false
。您可以调整它以满足您的需要。我认为这正是您需要的:这只适用于页面上显示的图像。使用此[0]。高度
和此[0]。宽度
代替(如果加载图像,则设置为图像尺寸),但在firefox上会提供24x24尺寸。在铬上可以很好地工作。我猜24*24是当找不到图像时显示的图像大小。没错,这两种解决方案都很糟糕。“完成”实际上得到了广泛支持。它已经在HTML5中标准化了,但在此之前很久就得到了支持(我相信甚至是IE6)。
jQuery.fn.isLoaded = function() {
return this
.filter("img")
.filter(function() { return this.complete; }).length > 0;
};