jquery - 删除小图像

Question

我有以下脚本来删除太小但无法正常工作的图像，第一次加载页面时，每个图像都被替换为no-image.png，刷新页面后它可以正常工作，我在这里缺少什么？

$(document).ready(function () {
    $('.story-img').error(function () {
        $(this).attr("src", "/Images/no-image.png");
        $(this).css('border', 'none');
    });

    $(".story-img").each(function () {

        var theImage = new Image();
        theImage.src = $(this).attr("src") || $(this).src;

        var imageWidth = theImage.width;
        var imageHeight = theImage.height;

        if (imageWidth < 32 || imageHeight < 32 || $(this).height() < 32 || $(this).width < 32) {
            $(this).attr("src", "/Images/no-image.png");
            $(this).css('border', 'none');
        }

    });
});

Answer 1

您可能在加载图像之前检查它们的 with（这使得它们的宽度和高度等于 0）。您可以使用$(image).load()：

$(".story-img").load(function () {

    //...

});

Answer 2

这可能是因为在页面 html 完成加载之前图像数据尚未完成加载。您可以使用 javascript LOAD 事件，该事件会等待所有图像完成加载。采用

$(window).load(function(){}