Jquery 如何防止img在不存在时加载

我正在使用这个jquery代码片段根据激活图像的名称（在末尾添加-hover）在hover上创建图像交换

唯一的问题是，当图像的悬停版本不存在时，它将给出404错误。我添加了一行代码，将display:none添加到none现有图像中

我想知道是否有一种方法可以防止在src不存在时追加img。代码如下：

jQuery(function($) {
    $(window).load(function() {
    var foto_container = $(".et_pb_image .et_pb_image_wrap");
    foto_container.each(function(index) {
        if ($(this).find('.et_overlay').length) {
            var str = $(this).find("img").attr("src");
            var strNew = str.replace(".jpg", "-hover.jpg");
            $(this).append('<div class="image_hover_wrapper"><img class="image_hover" src="' + strNew + '"></div>');
            $(this).find('.image_hover').on('error', function(){
                $(this).css("display", 'none');
            });
        }
    });
});
});

jQuery（函数（$）{
$（窗口）。加载（函数（）{
var foto_container=$（“.et_pb_image.et_pb_image_wrap”）；
foto_容器。每个（函数（索引）{
if（$（this）.find（'.et_overlay'）.length）{
var str=$（this.find（“img”）.attr（“src”）；
var strNew=str.replace（“.jpg”，“-hover.jpg”）；
$（此）。附加（“”）；
$（this）.find（'.image_hover'）.on（'error'，function（））{
$（this.css（“显示”，“无”）；
});
}
});
});
});

---

我是一个jquery初学者，如果这段代码让你哭泣，我很抱歉。我希望这是足够的信息

不，在尝试加载图像之前，无法判断图像是否不存在。您可以将事件处理程序挂接到

img

上的

error

事件，以便在图像加载失败时隐藏图像，但您仍然可以在控制台中看到404错误。好的，很高兴知道。谢谢不，在尝试加载图像之前，无法判断图像是否不存在。您可以将事件处理程序挂接到

img

上的

error

事件，以便在图像加载失败时隐藏图像，但您仍然可以在控制台中看到404错误。好的，很高兴知道。谢谢