1

好吧，所以我试图弄清楚如何根据某人选择的产品变体使内容出现和消失，并且在这里的一些人的帮助下，我设法获得了使内容出现和消失所需的 jQuery 代码在下拉菜单中的选定选项上，它在 Shopify 之外完美运行。唯一的问题是，一旦我尝试将其转移到 Shopify，它将无法工作。

这是我的 Shopify 页面上的代码部分：

<form action="/cart/add" method="post">
        {% include 'bracelet-hair' %}<br>     
        {% include 'braid-style' %}<br>
            {% if product.variants.size > 1 %}
            <div id="product-variants">      
                <select id="product-select" name="id">
                    {% for variant in product.variants %}
                        <option value="{{ variant.id }}">{{ variant.title }}</option>
                    {% endfor %}
                </select>
            </div><!-- product variants -->
             {%include 'engraving' %}

这是我的雕刻片段，这是我要显示的代码和内容。（下面的 '269270608' 是我的变体 ID）

<script>
$("#product-select").change(function(){
 var choice = $(this).val()

 if (choice == '269270608'){

//$('#checkbox').change(function(){
    $('#hide2').removeClass('hidden2');  //remove class here
//});

 }else{
    $('#hide2').removeClass().addClass('hidden2');  //else addclass
 }

});
</script>

<div id="hide2" class="hidden2">    
        <input type="checkbox" name="vehicle" value="Bike" />Engraving?
        <br>    
    Engraving Message:
        <input type="text" name="engraving">
        <br>    
</div>

不确定 Shopify 语法有多大，但我没有运气就去了他们的论坛。感谢您的帮助，如果您需要更多信息，请告诉我。

4

0 回答 0