Javascript shopify如何获取当前期权价值

这是用于显示数据的后端编码

<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 %}

          <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>

这个的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>

          <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。有人能帮我吗

          <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>

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

结果总是这样

          <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>

现在就买

          <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>

---

我需要根据选项选择动态更改该值，而不仅仅是固定在相同的值上。任何帮助都将不胜感激。

您可以使用纯javascript获取值

          <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>

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

然后将其传递给fastcart函数

          <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>

编辑：

          <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>

如果您想动态地执行此操作，只需将上述代码包装在函数ex:getSelectedValue中，并在select上使用onchange事件

          <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>

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

您还可以使用jQuery（可能已经加载到主题中），并在一行代码中完成所有这一切

          <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>