jquery - ajax调用后悬停图像

Question

<img class="tile-image clp-hover-img"
             src="${product.images.medium[0].url}"
             itemprop="image" data-src="${product.images.medium[0].hoverImageUrl}"/>

我在图像悬停时遇到问题。目前它工作正常，但在 ajax 调用之后，悬停图像将无法按预期工作。页面加载后，当我将鼠标悬停在图像上时，会加载新的悬停图像。当我使用样本 (AJAX) 选择新产品时，它通常会显示新图像。当我将鼠标悬停在它上面时，它会显示旧的悬停图像本身。

一旦我将图像悬停在容器上，就会显示悬停图像。选择新产品（颜色但产品相同）后，图像会正常更改，但悬停图像将显示与第一个产品颜色相同的图像。

var tempSrc = '';
 $(".clp-hover-img").hover(function(){
 tempSrc = $(this).attr('src');
 $(this).attr("src", $(this).data("src"));
 }, function(){
 $(this).attr("src",tempSrc);
});

标签： jquery