Javascript 使用For循环将变量追加到类

我需要一些关于我下面代码的帮助

基本上，我所需要做的就是向ul.cartRecommend类添加一个数字，如下所示：

保险商推荐书1、保险商推荐书2、保险商推荐书3等

每次循环发生时都需要这样做

所讨论的行是：var list=jQuery（'ul.cartcommond'）

我的问题是，无论附加到ul.cartRecommend的变量项属于哪个循环，所有的项都会被添加。我需要它们在单独的列表中

{% for item in cart.items reversed %}
{% if item.product.metafields.recommendations.productHandles %}
{% assign cartRecommend = item.product.metafields.recommendations.productHandles | split: ',' %}
<div class="recommendColumn hide-mobile">
      <div class="cart-recommend-contain">
        <h5>Customers who bought the "{{item.title}}", also bought:</h5>
      </div>
        <ul class="cartRecommend[someNumber]">
        </ul>
    </div>

{% assign image_size = "thumb" %}
<script type="text/javascript" charset="utf-8">
//<![CDATA[
  var recommendations = [];
  {% if cartRecommend %}
  recommendations = jQuery.trim({{ cartRecommend | json }}).split(/[\s,;]+/);
  {% endif %}

  if (recommendations.length && recommendations[0] !== '') {
    var list = jQuery('ul.cartRecommend[correspondingNumberForLoop]');
    for (var i=0; i<5; i++) {
      jQuery.getJSON( '/products/' + recommendations[i] + '.js', function(product) {
        list.append('<a class="cartRecommend" href="' + product.url +'"><li class="cartRecommend"><img style="padding:0 0.75em 100% 0;" align="left" src="' + product.images[0].replace(/(\.jpg|\.png|\.jpeg|\.gif)/, '_{{ image_size }}$1') + '" />' + product.title + '<br /><span class="money" style="color:#f03d04;">' + Shopify.formatMoney(product.price, '{{ shop.money_format }}') + '</span></li></a>');
        });
    }
  }
//]]>
</script>
{% endif %}
{% endfor %}

{%用于购物车中的商品。商品已反转%}
{%if item.product.metafields.recommendations.productHandles%}
{%assign CartRecommension=item.product.metafields.Recommensions.productHandles |拆分：'，'%}
购买“{item.title}}”的客户还购买了：

{%assign image_size=“thumb”%}
//
{%endif%}
{%endfor%}

代码生成后，如下所示：

//<![CDATA[
  var recommendations = [];
  var num = ['one', 'two', 'three'];

  recommendations = jQuery.trim(["two-rock-studio-pro-plus-50-head","two-rock-studio-pro-35-head-wine-taurus"]).split(/[\s,;]+/);


  if (recommendations.length && recommendations[0] !== '') {
    var list = jQuery('ul.cartRecommend');
    for (var i=0; i<5; i++) {
      jQuery.getJSON( '/products/' + recommendations[i] + '.js', function(product) {
        list.append('<a class="cartRecommend" href="' + product.url +'"><li class="cartRecommend"><img style="padding:0 0.75em 100% 0;" align="left" src="' + product.images[0].replace(/(\.jpg|\.png|\.jpeg|\.gif)/, '_thumb$1') + '" />' + product.title + '<br /><span class="money" style="color:#f03d04;">' + Shopify.formatMoney(product.price, '$ {{amount}}') + '</span></li></a>');
        });
    }
  }
//]]>

//<![CDATA[
  var recommendations = [];
  var num = ['one', 'two', 'three'];

  recommendations = jQuery.trim(["cuspcafordrz","drzbrlimiaia","lacablde20ft","lacaso20ftst","stslpaco1xca"]).split(/[\s,;]+/);


  if (recommendations.length && recommendations[0] !== '') {
    var list = jQuery('ul.cartRecommend');
    for (var i=0; i<5; i++) {
      jQuery.getJSON( '/products/' + recommendations[i] + '.js', function(product) {
        list.append('<a class="cartRecommend" href="' + product.url +'"><li class="cartRecommend"><img style="padding:0 0.75em 100% 0;" align="left" src="' + product.images[0].replace(/(\.jpg|\.png|\.jpeg|\.gif)/, '_thumb$1') + '" />' + product.title + '<br /><span class="money" style="color:#f03d04;">' + Shopify.formatMoney(product.price, '$ {{amount}}') + '</span></li></a>');
        });
    }
  }
//]]>

//
//

正如您所看到的，建议变量随生成的每个循环而变化，但是它们都被放入列表中。所以每个ul看起来都一样

---

我知道有一个简单的解决办法。请帮忙

您每次都选择相同的项目（'ul.cartRecommend'），并为每个响应循环它-您的所有.cartRecommend ul元素都将以所有项目的添加结束，无论JS解析的顺序如何。您需要选择ul.CartRecommension的某个子集，以便将结果附加到该子集。

好的，因此在某种液体的帮助下，我能够指定一个特定的ul类将数据发送到。问题是它只是将循环发送到最后一个ul

例如：

资料来源：

      <div class="cart-recommend-contain">
        <h5>Customers who bought the these items, also bought:</h5>
      </div>
{% for item in cart.items %}
{% if item.product.metafields.recommendations.productHandles %}
{% assign cartRecommend = item.product.metafields.recommendations.productHandles | split: ',' %}

    <div class="recommendColumn hide-mobile">
        <ul class="cartRecommend cart{{forloop.index}}">
        </ul>
    </div>

{% assign image_size = "thumb" %}
<script type="text/javascript" charset="utf-8">
//<![CDATA[
  var recommendations = [];
  {% if cartRecommend %}
  recommendations = jQuery.trim({{ cartRecommend | json }}).split(/[\s,;]+/);
  {% endif %}

  if (recommendations.length && recommendations[0] !== '') {
    var list = jQuery('ul.cartRecommend.cart{{ forloop.index }}');
    for (var i=0; i<5; i++) {
      jQuery.getJSON( '/products/' + recommendations[i] + '.js', function(product) {
        list.append('<a class="cartRecommend" href="' + product.url +'"><li class="cartRecommend"><img style="padding:0 0.75em 2.5em 0;" align="left" src="' + product.images[0].replace(/(\.jpg|\.png|\.jpeg|\.gif)/, '_{{ image_size }}$1') + '" />' + product.title + '<br /><span class="money" style="color:#f03d04;">' + Shopify.formatMoney(product.price, '{{ shop.money_format }}') + '</span></li></a>');
        });
    };
  };

//]]>
</script>
{% endif %}
{% endfor %}

购买这些商品的客户还购买了：
{cart.items%中的项目为%s}
{%if item.product.metafields.recommendations.productHandles%}
{%assign CartRecommension=item.product.metafields.Recommensions.productHandles |拆分：'，'%}


{%assign image_size=“thumb”%}
//
{%endif%}
{%endfor%}

输出：

//<![CDATA[
  var recommendations = [];

  recommendations = jQuery.trim(["two-rock-studio-pro-plus-50-head","two-rock-studio-pro-35-head-wine-taurus"]).split(/[\s,;]+/);


  if (recommendations.length && recommendations[0] !== '') {
    var list = jQuery('ul.cartRecommend.cart1');
    for (var i=0; i<5; i++) {
      jQuery.getJSON( '/products/' + recommendations[i] + '.js', function(product) {
        list.append('<a class="cartRecommend" href="' + product.url +'"><li class="cartRecommend"><img style="padding:0 0.75em 2.5em 0;" align="left" src="' + product.images[0].replace(/(\.jpg|\.png|\.jpeg|\.gif)/, '_thumb$1') + '" />' + product.title + '<br /><span class="money" style="color:#f03d04;">' + Shopify.formatMoney(product.price, '$ {{amount}}') + '</span></li></a>');
        });
    };
  };

//]]>


//<![CDATA[
  var recommendations = [];

  recommendations = jQuery.trim(["cuspcafordrz","drzbrlimiaia","lacablde20ft","lacaso20ftst","stslpaco1xca"]).split(/[\s,;]+/);


  if (recommendations.length && recommendations[0] !== '') {
    var list = jQuery('ul.cartRecommend.cart4');
    for (var i=0; i<5; i++) {
      jQuery.getJSON( '/products/' + recommendations[i] + '.js', function(product) {
        list.append('<a class="cartRecommend" href="' + product.url +'"><li class="cartRecommend"><img style="padding:0 0.75em 2.5em 0;" align="left" src="' + product.images[0].replace(/(\.jpg|\.png|\.jpeg|\.gif)/, '_thumb$1') + '" />' + product.title + '<br /><span class="money" style="color:#f03d04;">' + Shopify.formatMoney(product.price, '$ {{amount}}') + '</span></li></a>');
        });
    };
  };

//]]>

//
//