IE10 单击缩略图会在新窗口中打开大图像，而不是替换特色图像

Question

我有一个 Shopify 商店，当该产品有颜色变体时，该商店在特色图片下方有缩略图。单击缩略图时，它会将特色图像替换为大版本的缩略图。这在通常的Chrome，Firefox，Safari中效果很好，但在IE10中不起作用。在IE10中，当我单击缩略图时，它会在新窗口中打开大版本，而不是替换图像。

这是我的 HTML：

{% if product.images.size > 1 %}
      <ul id="product-photo-thumbs" class="clearfix grid">
        {% for image in product.images %}
        <li class="product-photo-thumb">
          <a href="{{ image.src | product_img_url: 'grande' }}">
            <img src="{{ image.src | product_img_url: 'small' }}" alt="{{ image.alt | escape }}" />
          </a>
        </li>
        {% endfor %}
      </ul>
      {% endif %}

这是javascript：

  // Load variant image into feature area
  $('.product-photo-thumb a').click(function() {
    var url = $(this).attr('href');
    $('#product-photo-container img').attr('src',url);
    event.preventDefault();
  });

有什么想法（除了告诉我的客户停止使用IE :P）？谢谢！

Answer 1

试试这个：

// Load variant image into feature area
$('.product-photo-thumb a').click(function(e) {
    e.preventDefault();
    var url = $(this).attr('href');
    $('#product-photo-container img').attr('src',url);
});

我认为您需要 2 件事，一个变量，使用 e 而不是event以避免关键字冲突。在你实际做事之前放置preventDefault。