隱藏輸入字段，除非選擇了特定變體-Shopify

Question

例如，除非選擇第六個變量，否則我需要隱藏三個輸入字段。 它們都與下面的代碼一起顯示。

<div class="product-form__item product-form__item--quantity">
    <label for="Quantity-{{ section.id }}">{{ 'products.product.quantity' | t }}</label>
    <input type="number" id="Quantity-{{ section.id }}" name="quantity" value="1" min="1" class="product-form__input" pattern="[0-9]*">
</div>

不知道這是否可以用於液體或JS，但我希望得到一些幫助

Answer 1

得到它與jQuery一起使用:)

jQuery("#SingleOptionSelector-0").change(function(){ 
  if($(this).val() == 'Personalized'){
    $(".product-form__item--quantity").show(); 
  } else { 
    $(".product-form__item--quantity").hide();
  }
});