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 に答える