图像载入未正确执行？

我想设置一个调整我的图像的onloads函数，以便如果图像大于用户的浏览器窗口，它调整自己。当我把这样的功能：图像载入未正确执行？

function resize(){ 
    console.log(this.width); 
}

它说0或NaN或undefined。如果我稍后在图像上运行该函数，我会得到正确的结果...我如何设置一个可以访问高度和宽度属性的onload？

编辑：对不起，这样的困惑：http://jsfiddle.net/9aDFe/

的图像正在搜索“风景”

来源

2011-12-08 mowwwalker

你能在[jsfiddle]（http://jsfiddle.net/）中重现这个吗？它适用于我：http://jsfiddle.net/EtzHT/ – gilly3

你的jsFiddle不会显示你的描述 –

@Chris，这真的很奇怪的错误。当我加载页面时不会发生，但是当我在jsfiddle上运行时它不会发生。任何人都知道这是为什么发生？ – mowwwalker

跨浏览器解决方案是使用readystatechange和负载的组合

var image = new Image(); 
image.addEventListener ("readystatechange", yourImageOnloadChecker); 
image.addEventListener ("load", yourImageOnloadChecker); 
image.src = "path/to/your/image"; // set SRC after your events. it's an IE fix

你的图像的onload检验器功能应该检查isNaN或等于0的高度/宽度，如果是，设置了一个回调以setTimeout自身。

来源

2011-12-09 00:05:37 Matthew

编辑这个答案被加入后的问题细节作出无效在谷歌上发现的我回答了。我将在此留作参考（因为这确实解决了一个有效且可能发生的问题），但请注意，这不是OP描述的特定问题的解决方案。

如果您正在使用提供“domReady”事件的库（甚至在某些情况下，如果脚本位于页面底部），则onload函数未附加到图像上及时 - 它已经加载。特别是如果您使用的是body.onload事件 - 在图像完全加载之前不会触发。

如果您想以这种方式处理图像（通过代码body.onload执行），那么您可以直接访问图像 - 它已经加载。动态放置在页面上的后续图像将按照您的预期触发onload事件，因为它们是在事实之后添加的。

查看https://developer.mozilla.org/en/DOM/window.onload以获取关于该事件的更多讨论，并提出了在装载过程中不同时间点火的替代方案。

来源

2011-12-08 23:13:28

但它确实运行 - “它说0或NaN或未定义”。如果它没有运行，它将如何登录到控制台？我不认为这是问题。（不是我downvote，顺便说一句） – gilly3

是的。添加的OP的jsFiddle也不会为我显示错误。 –

图像载入未正确执行？

回答

相关问题