0

我目前正在使用以下函数在 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。但是我怎样才能将我的 setTimeOut 替换为更有效的东西......意思是，当我的产品图像的 src 更新时，我想执行 console.log(....)。如果我的图像元素看起来像这样，我该怎么做...

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

当图像根据您选择的选择发生变化时，<img> 标签将像这样更改 src...

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

感谢您的任何建议！

4

2 回答 2

1

当我的产品图像的 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 是什么或它是如何存储的，但您可能会考虑将其存储在data属性中。我也会转移itemprop到数据属性，而不是使用这样的自定义道具：

<img id="imgLargeImageImage" class="nextProdImage" data-itemprop="image" data-sku="SHT-GD-N-394" src="http://.../.../.../SHT-GD-N-394.jpg" alt="BLUE Shirt" />
于 2012-12-07T16:51:37.337 回答
0 
 var img_url = 'http://.../.../.../';
       jQuery(function($){
         var mselect = $("#myselect");
         mselect.live('change',function () {
        window.setTimeout(function () {
            console.log("the new value is now: "+nextQuery(".nextSKU").text());
            //this is how you can channge the image path
            var img_name = mselect.val(); //your drop down should have image name as values. 
            mselect.attr('src',image_url+img_name);//set the new image path.

          },3000);
    });
});
于 2012-12-07T16:57:11.547 回答