0

少し前に質問をしたところ、いくつか間違いを犯したことに気づき、自分のやり方を考え直して、もう一度きれいな質問をしたいと思いました。

選択リストがあります、

<select id="product-variants" name="id">
<option title="AFX4000ZC-KLYSM" value="54964022" id="variant-54964022">Kelly Green</option>

<option title="AFX4000ZC-GAR3X" value="55708562" id="variant-55708562">Garnet</option>

<option title="AFX4000ZC-CHTXL" value="55708752" id="variant-55708752">Gun metal Heather</option>
</select>

選択したら、このULを検索する必要があります

<ul style="display: none;" id="preload">

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-gunmetal-heather-icon_medium.jpg?1290984341">
          </li>

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-gunmetal-heather-icon-1_medium.jpg?1290984341">
          </li>

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-gunmetal-heather-icon-2_medium.jpg?1290984341">
          </li>

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-garnet-icon_medium.jpg?1290984341">
          </li>

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-garnet-icon-1_medium.jpg?1290984341">
          </li>

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-garnet-icon-2_medium.jpg?1290984341">
          </li>

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-kelly-green-icon_medium.jpg?1290984341">
          </li>

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-kelly-green-icon-1_medium.jpg?1290984341">
          </li>

          <li>
             <img alt="" src="http://mysite.com/s/files/1/0055/1242/products/afx4000z-kelly-green-icon-2_medium.jpg?1290984341">
          </li>

        </ul>

次に、この画像をsrcで更新する必要があります

<div class="image">
   <img src="default.jpg"/>
</div>

これは私が現在持っているものですが、クライアントが画像の命名規則を変更しないため、機能しません。誰かがこれを回避する方法を私にアドバイスできますか？

    jQuery(function() {

  jQuery('[name=id]').change(function() {

    var sku = jQuery(this).find(':selected').attr('title');

    // Looking for the preloaded image which src attribute contains the sku.
    var new_src = jQuery('#preload img[src*=' + sku + ']').attr('src');

    // Updating the main image and the href attribute of the anchor element that wraps it.
    jQuery('div.image img').attr('src', new_src);
  });
});
4

1 に答える 1

0

各画像のSRCを取得し、indexOfメソッドを使用して、SKUが画像srcに表示されるかどうかを確認します。表示される場合は、デフォルトに変更します。

于 2010-12-22T11:39:03.410 に答える