javascript - 更改图像的 Src 在首次加载时不起作用

Question

我编写了一些代码，这些代码将在加载时检查图像的自然大小，如果它符合特定标准，则更改 src。该脚本工作正常，但由于某种原因，它在我第一次加载页面时不起作用。

如果我刷新页面，图像就会按预期替换。我猜这与 dom 中不可用的自然尺寸有关，但似乎无法在网上找到任何解决方案。

如有任何帮助，我们将不胜感激。

谢谢

史蒂夫

这是我的代码...

<script type="text/javascript">

jQuery(document).ready(function(){
    jQuery('img').each(function(index){
        // check if browser is html5 compatible or not
        var img = jQuery(this);
        if (typeof img.naturalWidth == "undefined") {
            var newImg = new Image();
            newImg.src = img.attr('src');
            if(newImg.height == 80 && newImg.width == 80){
                jQuery(this).attr("src", "/2/files/no_image.jpg")
            }
        }else{
            if(img.naturalWidth == 80 && img.naturalHeight == 80)jQuery(this).attr("src", "/2/files/no_image.jpg");
        }
    });
});

</script>

Answer 1

$(document).ready() 在页面生命周期中运行得太快。如果图像仍在从服务器下载，则不会有尺寸。尝试使用 $(window).load() 代替。

https://stackoverflow.com/a/8396457/120955