Question

我有多个DIV，每个DIV都包含一个独特的产品，每个产品都有自己独立的DIVS类（图片，产品名称，产品价格和产品图片）。

我希望每个产品DIV都有自己的图像名称与SKU匹配。但相反，它会为每个图像找到相同的第一个SKU！我希望这是有道理的！我想我需要以某种方式在某处应用“each”或/和“this”......

非常感谢您的帮助！

这是HTML：

<div class="product-box"><img class="product-img">
    <div class="product name">Geax 26" x 2.00 Cross Country Tyre Folding White</div>
    <div class="product price">£14.99</div><div class="product sku">112.3SG</div>
</div>

<div class="product-box"><img class="product-img">
    <div class="product name">Schwalbe Doc Blue Tubeless Sealant 60ML</div>
    <div class="product price">£5.99</div><div class="product sku">3710</div>
</div>

<div class="product-box"><img class="product-img">
    <div class="product name">Schwalbe Doc Blue Tubeless Sealant 500ML</div>
    <div class="product price">£15.99</div><div class="product sku">3711</div>
</div>

这是JQuery：

    $(document).ready(function () {
        var imagesrcname = $('.product.sku').html();
        $( ".product-img" ).attr("src","images/products/" + imagesrcname + ".jpg" );
    });

Answer 1

使用each。这是一个例子：

$('.product.sku').each(function( index ) {
   console.log( index + ": " + $( this ).text() );
});

Answer 2

制作

$(document).ready(function () {
    $('.product-box .sku').each( function(){
          var imagesrcname = $( this ).html();
          $( this ).parent().find( ".product-img" ).attr("src","images/products/" + imagesrcname + ".jpg" );
    } );
});

基本上你需要遍历所有产品skus并将他们各自的图像名称（sku div内的html）作为src属性添加到image。

Answer 3

迭代图像：

events: [
  {
    title: 'All Day Event',
    start: '2015-12-01',
    url: 'http://google.com'
  }

复制每个而不是第一个唯一数据（div容器的.sku div .html到图像div的img attr（“src”））

3 个答案: