如何在jQuery中与实时更改功能和外部照片更改建立关系？

我目前正在使用以下函数为HTML选择选项设置更改事件内部的超时

jQuery(function($) {
var mselect = $("#myselect");
mselect.live('change',function () {
window.setTimeout(function () {
console.log("the new value is now: "+nextQuery(".nextSKU").text());
},3000);
});
});

每次我的选择选项更改时，我几乎都会为一个项目写出一个sku号，并为延迟效果设置一个超时。但是，我如何替换setTimeOut以获得更高效的功能…也就是说，当我的产品映像的src更新时，我希望执行console.log（..）。如果我的图像元素看起来像这样，我该怎么做

<img id="imgLargeImageImage" class="nextProdImage" itemprop="image" src="http://.../.../.../SHT-GD-M-SM1.jpg" alt="Gold Shirt">

<img id="imgLargeImageImage" class="nextProdImage" itemprop="image" src="http://.../.../.../SHT-GD-N-394.jpg" alt="BLUE Shirt">

<img id="imgLargeImageImage" class="nextProdImage" data-itemprop="image" data-sku="SHT-GD-N-394" src="http://.../.../.../SHT-GD-N-394.jpg" alt="BLUE Shirt" />

当图像根据您选择的select更改时，标记将更改src，如下所示

<img id="imgLargeImageImage" class="nextProdImage" itemprop="image" src="http://.../.../.../SHT-GD-M-SM1.jpg" alt="Gold Shirt">

<img id="imgLargeImageImage" class="nextProdImage" itemprop="image" src="http://.../.../.../SHT-GD-N-394.jpg" alt="BLUE Shirt">

<img id="imgLargeImageImage" class="nextProdImage" data-itemprop="image" data-sku="SHT-GD-N-394" src="http://.../.../.../SHT-GD-N-394.jpg" alt="BLUE Shirt" />

谢谢你的建议

当我的产品映像的src更新时，我想执行console.log（..）

然后，您需要在映像加载时绑定实际的日志调用

$('img.nextProdImage').load(function (e) {
   console.log("the new value is now: "+nextQuery(".nextSKU").text());
});
$("#myselect").live('change', function (e) {
   // set the new image src based on the selected SKU
});

这里唯一需要注意的是，您需要确保获得正确的SKU进行记录。我不确定下一个SKU是什么，也不确定它是如何存储的，但您可能会考虑将其存储在

数据

属性中。我还想将

itemprop

移动到数据属性，而不是像这样使用自定义道具：