Javascript Shopify添加到购物车功能一次只能运行一个，不能循环运行

我正在创建一种方法，将Shopify集合中的所有产品添加到购物车中，作为销售捆绑包的一种方法

我有一个JavaScript脚本，用于确定选择哪一级别的工具包，并循环遍历集合中的每个产品。我们希望不止一次添加捆绑包中的一些产品，这些产品由标签basicbundleqty:x控制。因此，代码循环遍历每个产品的标记，检查是否有此标记，如果有，则将qty设置为标记的后缀

<script> 

var selected = "not selected";

function kitSelect(){
  selected = document.getElementById('select').value;
  /*if(selected == "not selected"){
    alert('Please select a kit level');
  }
  if(selected == "basic"){
    alert('basic');
  }
  if(selected == "standard"){
    alert('standard');
  }
  if(selected == "pro"){
    alert('pro');
  }*/
} 

function addBundle(){
  var qty = 0;
  if(selected == "basic"){
    {% for kitproduct in collections['Basic-Fixture-Plate-Starter-Kit'].products %}
        qty = 1;
        {% for t in kitproduct.tags %}
            {% if t contains 'basicqty:' %}
                {% assign qty = t | remove: 'basicqty:'%}
                {% assign qty = qty | plus: 0 %}
                qty = {{ qty | json }};
            {% endif %}
        {% endfor %}
        jQuery.post('/cart/add.js', {
          quantity: qty,
         id: {{ kitproduct.variants[0].id }},
        properties: {
        }
      });
    alert(qty);
    {% endfor %}
  } else {
    alert("Please select a kit level first");
  }
  window.location.reload(false);
}
</script>

var selected=“not selected”；
函数kitSelect（）{
selected=document.getElementById（'select'）。值；
/*如果（已选择==“未选择”）{
警报（“请选择套件级别”）；
}
如果（选定==“基本”）{
警报（“基本”）；
}
如果（选定==“标准”）{
警报（“标准”）；
}
如果（所选==“专业”）{
警报（“pro”）；
}*/
} 
函数addBundle（）{
变量数量=0；
如果（选定==“基本”）{
{集合['Basic-Fixture-Plate-Starter-Kit']中kitproduct的百分比。products%}
数量=1；
{kitproduct.tags%中t的%s}
{%t如果包含“基本属性：”}
{%assign qty=t |删除：'basicqty:'}
{%分配数量=数量|加：0%}
数量={{qty | json}}；
{%endif%}
{%endfor%}
jQuery.post（'/cart/add.js',{
数量：数量，
id:{{kitproduct.variants[0].id}，
特性：{
}
});
警报（数量）；
{%endfor%}
}否则{
警报（“请先选择套件级别”）；
}
window.location.reload（false）；
}

这种方法确实有效，但有一个怪癖。无行

预警（数量）在for循环结束时，代码不起作用。如果没有该警报，代码似乎会随机添加一两个集合产品

为什么这只适用于
alert（）
函数，并且是否有一个修复程序允许它通过一次单击将它们全部添加到购物车，而不需要用户单击每个警报窗口？
问题在于您发送的异步请求

带有警报的循环可以工作，因为每次警报出现时脚本都会停止。同时，异步请求得到处理

Shopify明确建议不要采用并行添加产品的模式

如果您想一次添加多个产品，可以使用shopify文档中描述的一个请求添加它们：

jQuery.post('/cart/add.js', {
  items: [
    {
      quantity: 1,
      id: 794864229,
      properties: {
        'First name': 'Caroline'
      }
    },
    {
      quantity: 2,
      id: 826203268,
      properties: {
        'First name': 'Mike'
      }
    }
  ]
});

这是解决办法。正如所指出的，我需要创建一个请求，并在请求中循环每个产品，而不是为集合中的每个产品创建一个请求。这里是工作函数（减去数量检查，我需要再加上）：

这就是我正在做的，这是我用来构建我的代码。请求中的for循环是否可以解决此问题，因为它只对每个产品发出一个请求，而不是新请求？是的，这正是解决此问题的方法。您可以在循环中构建项目列表，并在收集完所有要添加购物车的项目后发送请求。嘿，欢迎使用SO，Alex！我认为对你自己的问题轻易地修改现有的答案是一种相对糟糕的形式。为什么不将@frieder's标记为“已接受”，并建议对其进行修改呢？
  function addBundle2(){
    jQuery.post('/cart/add.js', {
      items: [
        {% for kitproduct in collections['Pallets'].products %}
        {
          quantity: 1,
          id: {{ kitproduct.variants[0].id }},
          properties: {
          }
        },
        {% endfor %}
      ]
    });
    window.location.reload(false);
  }