Shopify如何获得当前选项值

shopify how to get current option value

本文关键字：选项 何获得 Shopify      更新时间：2023-09-26

这是显示数据的后端编码。

<div class="select clearfix"{% if hide_default_title %} style="display:none"{% endif %}>
                <select id="product-select" name="id">
                  {% for variant in product.variants %}
                  <option value="{{ variant.id }}">{{ variant.title }} - {{ variant.price | money }}</option>
                  {% endfor %}
                </select>
              </div>
              {% if settings.display_quantity_dropdown %}
              <div class="selector-wrapper">
                <label>Quantity</label>
                <input id="quantity" type="text" name="quantity" value="1"  min="1" class="tc item-quantity" />
              </div>
              {% endif %}
              <div class="purchase-section{% if product.variants.size > 1 %} multiple{% endif %}">
                <div class="purchase">
                  {% unless product.available %}
                  <p>Sold Out</p>
                  {% else %}

这个的html结果是

          <option value="720021189">Blue / Medium / V-Neck - $ 19.99</option>
          <option value="720021193">green / Large / V-Neck - $ 25.00</option>
          <option value="720021197">red / XL / V-Neck - $ 25.00</option>
        </select>
      </div>

所以我的问题是，当我选择生产的选项值必须给onlink，我在下面提到。但它总是取第一个值720021189。有人能帮我一下吗?

              <a href="javascript:void(0)" id="add-to-cart" onclick="fastcart({{product.variants.first.price}},1)"><span></span>Buy it now</a>

结果总是

现在就买

我需要根据选项选择动态更改该值，而不仅仅是固定在相同的值上。

您可以使用普通javascript获取值。

var productSelect = document.getElementById('product-select');
var variantId = productSelect.options[productSelect.selectedIndex].value;

然后传递给fastcart()函数。

编辑:

如果你想"动态地"做它，只需将上面的代码包装在一个函数中(例如:getSelectedValue)，并在你的select上使用onchange事件。

<select id="product-select" name="id" onchange="getSelectedValue()">

您也可以使用jQuery(可能已经加载在您的主题中)，并在一行代码中完成所有这些

相关文章：