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');
}

}）;

感谢我的朋友Barbara Laird看到我拼错了。

jQuery脚本在Google Chrome上无法正常运行

2 个答案: