日期:2014-05-16  浏览次数:20375 次

alert对img的onload的影响,求解释
如以下代码

window.onload=function(){
var img=new Image();
img.src="aaa.jpg";
alert(img.width+","+img.height);//加了这一句后,下面的onload里面的语句不执行了,去掉就可以
img.onload=function(){
alert("测试");
}
}

如果我加上了“alert(img.width+","+img.height);”之后,“img.onload”里面的就不会执行,即弹出了图像的宽度和高度(是正确的宽高);但是去掉“alert(img.width+","+img.height);”,“img.onload”里面的就可以执行,即弹出一个“测试”,我使用的是火狐浏览器

------解决方案--------------------
alert后后面的js语句没有执行,但是不会挂起图片的下载,等你点击ok后图片可能已经下载完毕了,在增加onload事件就不会执行了

就如下面这样,不会执行alert

    window.onload = function () {
        window.onload = function () { alert(1234)}
    }

------解决方案--------------------
引用:
是1楼的写法,因为你在图片没有加载完就打印出它的宽与高是不对的。得不出来
开玩笑吗?原理3楼说了,2楼说得对,onland事件最好在src赋值前绑定,你不要以为绑了立刻执行而得不到高宽,那是加载完后执行,会得到宽高值的。
------解决方案--------------------
你alert的时候 整个 js的运行线程 是被卡住的

后面的 语句 并没有被调用 

所以  这个时候  img.onload还没有 赋值

但是 img的加载是其他的线程在运行 所以仍旧在加载图片
很可能  这个时候 图片加载 完毕了 但是 alert还卡在哪里 img.onload 还没有设置回调方法

之后你点掉了alert在设置 img.onload 但是 图片已经加载完了 不会在触发onload了


另外 如果图片是缓存的话 那么img可能直接就加载完毕了 看浏览器怎么缓存了