Html 设置为';时动态按钮冻结页面加载;预购';

Html 设置为';时动态按钮冻结页面加载;预购';,html,shopify,liquid,Html,Shopify,Liquid,我有一个动态按钮,我目前已设置为在“添加到购物车”、“可用时通知我”和“预订单”之间切换。该按钮在所有设置下都能正常工作,但当设置为“预订单”时,页面在大约80%的时间内无法加载 “预订单”功能由shopify产品上的标签触发 我在inspector中注意到,在常规产品上,主体html字符串显示以下内容: <body id="lu-goldie-pre-order-test" class="template-product animations-disable

我有一个动态按钮,我目前已设置为在“添加到购物车”、“可用时通知我”和“预订单”之间切换。该按钮在所有设置下都能正常工作,但当设置为“预订单”时,页面在大约80%的时间内无法加载

“预订单”功能由shopify产品上的标签触发

我在inspector中注意到,在常规产品上,主体html字符串显示以下内容:

<body id="lu-goldie-pre-order-test" class="template-product animations-disabled loaded">

但标有“预订单”的产品不会在代码行中显示“已加载”。 然后我可以输入它,整个页面就会出现。非常混乱

您可以查看以下页面:

/

下面是如何应用“pre-order”标记的代码片段:

            <div class="form-vertical">
          {% form 'product', product, id: "AddToCartForm" %}

            {% assign hide_default_title = false %}
            {% if product.variants.size == 1 and product.variants.first.title contains 'Default' %}
              {% assign hide_default_title = true %}
            {% endif %}

            {% if product.variants.size > 0  %}
              <p itemprop="name" class="">{{ product.variants.first.title }}</p>
            {% endif %}


            <select name="id" id="productSelect-{{ section.id }}" class="needsclick product-single__variants original-select no-js" autocomplete="off">
              {% for variant in product.variants %}
                {% if variant.available %}

                  {% comment %}
                    Note: if you use option_selection.js, your <select> tag will be overwritten, meaning what you have inside <option> will not reflect what you coded below.
                  {% endcomment %}
                  <option {% if variant == product.selected_or_first_available_variant %} selected="selected" {% endif %} data-sku="{{ variant.sku }}" value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money_with_currency }}</option>

                {% else %}
                  <option disabled="disabled">
                    {{ variant.title }} - {{ 'products.product.sold_out' | t }}
                  </option>
                {% endif %}
              {% endfor %}
            </select>

            {% if section.settings.show_quantity_selector %}
              <label for="Quantity" class="quantity-selector product-sub-label">{{ 'products.product.quantity' | t }}</label>

              {% if settings.ajax_cart_method == "drawer" %}
                <input type="number" id="Quantity" name="quantity" value="1" min="1" class="quantity-selector" />
              {% else %}
                <div class="js-qty nonajax-quantity-selector">
                  <button type="button" class="js-qty__adjust js-qty__adjust--minus icon-fallback-text">
                    <i class="fa fa-minus" aria-hidden="true"></i>
                    <span class="fallback-text">−</span>
                  </button>
                  <input type="text" class="js-qty__num" value="1" min="1" aria-label="quantity" pattern="[0-9]*" name="quantity" id="Quantity">
                  <button type="button" class="js-qty__adjust js-qty__adjust--plus icon-fallback-text">
                    <i class="fa fa-plus" aria-hidden="true"></i>
                    <span class="fallback-text">+</span>
                  </button>
                </div>
              {% endif %}
            {% endif %}

            {% if product.compare_at_price_max > product.price %}
            <p id="ComparePrice" class="js">
              <span class="money">{{ current_variant.compare_at_price | money }}</span>
            </p>
            <span class="visually-hidden">{{ 'products.general.sale_price' | t }}</span>
            {% endif %}

            {% case section.settings.show_discount %}

              {% when 'percentage' %}

                <li class="product-page--pricing--discount">
                  <span class="variant-percentage-wrapper{% unless on_sale %} hide{% endunless %}">
                    -<span class="variant-percentage">{{ current_variant.compare_at_price | minus: current_variant.price | times: 100.0 | divided_by: current_variant.compare_at_price | money_without_currency | times: 100 | remove: '.0'}}%</span>
                  </span>
                </li>

              {% when 'value' %}

                <li class="product-page--pricing--discount">
                    <span class="variant-value-wrapper{% unless on_sale %} hide{% endunless %}">
                      -<span class="variant-value"><span class="money">{{ current_variant.compare_at_price | minus: current_variant.price | money }}</span></span>
                    </span>
                </li>

            {% endcase %}

            <span class="visually-hidden">{{ 'products.general.regular_price' | t }}</span>
            <span id="ProductPrice" class="h6 js" itemprop="price" content="{{ current_variant.price | divided_by: 100 }}">
              <span class="money">{{ current_variant.price | money }}</span>
            </span>


              {% unless current_variant.available %}
            <div class="paymentButtonsWrapper">
              <button type="submit" name="add" id="AddToCart" class="btn{% if section.settings.show_smart_checkout %} add-to-cart--secondary{% endif %}">
                <a class="klaviyo-bis-trigger" href="#">Notify Me When Available</a>
              </button>
              {% if section.settings.show_smart_checkout %}
                {{ form | payment_button }}
              {% endif %}
            </div>
                        {% endunless %}



              {% if current_variant.available %}

              {% if product.tags contains 'pre-order' %}
              <div class="paymentButtonsWrapper">
                <button type="submit" name="add" id="AddToCart" class="btn{% if section.settings.show_smart_checkout %} add-to-cart--secondary{% endif %}">
                  <a>{% for tag in product.tags %}{{ tag }}{% endfor %}</a>
                </button>
              </div>
                {% else %}


            <div class="paymentButtonsWrapper">
              <button type="submit" name="add" id="AddToCart" class="btn{% if section.settings.show_smart_checkout %} add-to-cart--secondary{% endif %}">
                <span id="AddToCartText">{{ 'products.product.add_to_cart' | t }}</span>
              </button>

              {% if section.settings.show_smart_checkout %}
                {{ form | payment_button }}
              {% endif %}
            </div>
            {% endif %}

                {% endif %}

        {% endform %}


      </div>

{%form'product',product,id:“AddToCartForm”%}
{%assign hide\u default\u title=false%}
{%如果product.variants.size==1且product.variants.first.title包含“默认”%}
{%assign hide\u default\u title=true%}
{%endif%}
{%如果product.variants.size>0%}

{{{product.variants.first.title}

{%endif%} {product.variants%中的变量为%0} {%if variant.available%} {%comment%} 注意:如果您使用option_selection.js,您的标记将被覆盖,这意味着您的内部内容将不会反映您在下面编写的代码。 {%endcomment%} {{variant.title}}-{{variant.price}货币} {%else%} {{variant.title}}-{{'products.product.salled|t} {%endif%} {%endfor%} {%if section.settings.show_quantity_selector%} {{'products.product.quantity'|t} {%if settings.ajax\u cart\u method==“抽屉”%} {%else%} − + {%endif%} {%endif%} {%if product.compare_at_price_max>product.price%}

{{current_variant.compare_at_price|money}

{{产品.一般.销售价格} {%endif%} {%case section.settings.show_折扣%} {%when'百分比'%}
  • -{current_variant.compare_at_price |减:current_variant.price |倍:100.0 |除以:current_variant.compare_at|price |货币|倍:100 |删除:'.0'}%
  • {%when'值“%”
  • -{{current_variant.compare_at_price}减:current_variant.price | money}
  • {%endcase%} {{产品.一般.正常价格{t} {{current_variant.price{124; money}} {%除非当前_variant.available%} {%if section.settings.show_smart_checkout%} {{表格|付款按钮} {%endif%} {%end除非%} {%如果当前_variant.available%} {%如果product.tags包含“预订单”} {%for product.tags%}{{tag}{%endfor%} {%else%} {{'products.product.add_-to_-cart'|t} {%if section.settings.show_smart_checkout%} {{表格|付款按钮} {%endif%} {%endif%} {%endif%} {%endform%}