判断图片是否加载完成，用javascript 或 jquery

大王叫我来找妞 2011-12-02 05:21:44

如题，我去GOOGLE搜了一下，但要么代码太多，要么不能正确执行，总之希望大家给个简单的代码或思路，时间有点紧。

图片加载完成后alert就下就OK。非常感谢。

...全文

11200 13 打赏收藏转发到动态举报

写回复

用AI写文章

13 条回复

切换为时间正序

请发表友善的回复…

发表回复

dengdan99 2012-06-01

打赏
举报

asd asd as dasd

大王叫我来找妞 2011-12-21

打赏
举报

其实大家说的都有道理，但最符合我心意的是11楼，因为它用到了回调，解决了我一个问题。感谢大家

Legend1988 2011-12-05

打赏
举报



function loadImage(url, callback) {

	var img = new Image(); //创建一个Image对象，实现图片的预下载

	img.src = url;

	

	if(img.complete) { // 如果图片已经存在于浏览器缓存，直接调用回调函数

	    callback.call(img);

	    return; // 直接返回，不用再处理onload事件

    }

	img.onload = function () { //图片下载完毕时异步调用callback函数。

        callback.call(img);//将回调函数的this替换为Image对象

    };

};

大王叫我来找妞 2011-12-05

打赏
举报

大家提的我都试过，不行。郁闷。
我只需要在谷歌浏览器运行正常就行。

碧海情天-赵亮 2011-12-03

打赏
举报

[Quote=引用 4 楼 nevermore_0923 的回复:]
jq的$(function(){ })不用等所有加载完执行

js的onload是等到所有加载完才执行
[/Quote]
window.onload和img的onload是两回事。

默默不得鱼 2011-12-02

打赏
举报

document.getElementById("img2").onload=function(){}
这是对的

rao3324180 2011-12-02

打赏
举报

[Quote=引用 4 楼 nevermore_0923 的回复:]

jq的$(function(){ })不用等所有加载完执行

js的onload是等到所有加载完才执行
[/Quote]楼主是想要图片加载完

p2227 2011-12-02

打赏
举报

[Quote=引用 4 楼 nevermore_0923 的回复:]

jq的$(function(){ })不用等所有加载完执行

js的onload是等到所有加载完才执行
[/Quote]这个跟楼主的问题没有必然关系吧。

狄默默斯基 2011-12-02

打赏
举报

[Quote=引用 4 楼 nevermore_0923 的回复:]

jq的$(function(){ })不用等所有加载完执行

js的onload是等到所有加载完才执行
[/Quote]

js的onload是等到所有加载完才执行话是没错，，我试过，貌似谷歌，ie是对的，，火狐不是这样的

弦弦 2011-12-02

打赏
举报

jq的$(function(){ })不用等所有加载完执行

js的onload是等到所有加载完才执行

yefeng_214 2011-12-02

打赏
举报

//jquery的方式
$("#imageId").load(function(){
alert("加载完成！");
});

三石-gary 2011-12-02

打赏
举报



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<title>判断图片是否加载完成</title>



</head>

<body>

<img id="img2" src="images/1.jpg" />

</body>

</html>

<script language="JavaScript">

    document.getElementById("img2").onload = function () {

        alert("图片加载已完成");

    }

</script>

改下图片地址就行了

三石-gary 2011-12-02

打赏
举报

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<title>判断图片是否加载完成</title>



</head>

<body>

<img id="img1" src="http://www.szczw2008.com/Photo/UploadPhotos/200903/2009030800554373.gif" />

<img src="http://www.hangyezhishi.com/uploadfile/2009/0509/20090509030802951.jpg"/>

<img id="img2" src="http://shimg.focus.cn/upload/photos/2911/oRl1RWaA.jpg" />

</body>

</html>

<script language="JavaScript">

document.getElementById("img2").onload=function()

{

alert("图片加载已完成");

}

</script>