jQuery скрипт не работает должным образом в Google Chrome

Question

У меня есть следующий код, который, похоже, не работает в Google Chrome.

$("#productImg img").click(function() { 
    var img = $(this).attr("src"); 
    var text = $(this).attr("id"); 
    $("#loader").show(); 
    $("#largeImg img").load(function() { 
     $("#loader").hide(); 
    }).attr("src", img.replace('th_', 'si_')); 
}); 

Он отлично работает в Firefox, но не в Chrome. Если я нажму на первое изображение, он сделает какой-то цикл и никогда не скрывает #loader. Вы можете проверить его here.

Любая помощь приветствуется!

Answer 1

Чтобы проверить, если загружен образ, который вы можете использовать imagesLoaded (https://github.com/desandro/imagesloaded)

var imgLoad = imagesLoaded("#largeImg img"); 
function onAlways(instance) { 
    console.log('all images are loaded'); 
} 
imgLoad.on('always', onAlways); 

Answer 2

я сделать его работу, сравнивая 2 изображения

$("#productImg img").click(function(){ 
var img = $(this).attr("src"); 
var smallImage = $("#largeImg img").attr("src").replace('si_', 'th_'); 

if(img == smallImage){ 
    alert('match'); 
}else{ 
    alert('not a match'); 
} 

});

Спасибо моей подруге Барбаре Лэрд за то, что она увидела мои орфографические ошибки.