气质Shopify jQuery

Question

我碰到了一堵墙，为Shopify网站开发自定义主题。

背景/预期功能

我正在使用的功能是在结帐时弹出的菜单，可以为用户提供一些免费礼物的选择，如果是或小计超过一定数量。如果购物车的小计金额超过另一个更高的金额，则会为用户提供第二层免费礼物。

如果用户已经选择了常规的免费礼物，但购物车的小计增加并最终超过了较高的等级金额，则将为他或她提供将较低等级的礼物交换为较高等级的礼物的机会。

问题

这一切都很好，直到我们合并了具有多种变体的免费礼物。一旦为用户提供了选择他们想要的较低等级礼物的选项的选项，当他们尝试将其换成较高等级的礼物时，既不会删除旧礼物，也不会添加新礼物，或两者兼有（但通常旧礼物不会被删除）。无论哪种方式，行为都非常不一致，并且只能在10％的时间内正确运行。

这是将免费礼物换成更高层礼物的jQuery：

// hide popup form when background is clicked
$('#overlay').click(function(e) {
    var form = $("#gift-popup");
    var overlay = $(this);
    // only hide if anywhere BUT form is clicked
    if (!form.is(e.target) && form.has(e.target).length === 0) {
        overlay.removeClass('active');
    }
});
// add free gift to cart (if selected by either radio button or drop down menu)
addToCart = function( queue = null, free_sample_line = null ) {
   // create queue if not created yet
   if (!queue) {
     var queue = '';
     queue = $('#gift-selection').children("option:selected").val();

     if (!queue) { // if there were no variants
       // iterate through checkboxes to find all the checked ones
       $('input[type=radio]').each(function() {
          if (this.checked) {
           queue = this.value;
         }
      });
    }        
  }

  $.ajax({
    type:"POST",url:"/cart/add/?id=" + queue, dataType:"HTML",
    success:function(){
      // refresh window
      window.location.replace("/cart"),
    }
  });

}
// swap free gift for another one
function swap( free_sample_line ) {
  $('#overlay').removeClass('active'); // hide popup
  $.get('/cart/change?line=' + free_sample_line + '&quantity=0'); // remove from cart
  addToCart(); // add new item to cart and refresh
}

提前感谢您的帮助！